【发布时间】：2016-01-21 18:19:55
【问题描述】：
我注意到标准 :hover 在图像上显示的宽度值不是原始值，当鼠标悬停生效时会导致轻微的晃动动画。我认为这是由于发生了一些像素舍入，但为什么悬停时显示的图像不同？
请参考我在http://jsfiddle.net/z29LM/8/上的测试用例
请注意，前两个图像在悬停时很好（因为它们使用原始图像宽度/高度），但所有其他图像似乎都在右侧和底部添加了 1 个像素。应用哪种悬停效果似乎并不重要（例如，背景颜色会导致相同的问题）。
所以解决方法似乎是打开 Gimp 并手动将图像调整到目标宽度/高度，或者是否有针对此现象的 html/css 修复？
编辑：
所以这似乎是一个仅限 Firefox 的错误（使用 13.0.1）。答案中发布的链接建议通过将box-shadow: #000 0em 0em 0em; 添加到图像元素来快速修复。请参阅http://jsfiddle.net/z29LM/9/ 以获取固定/工作版本。
【问题讨论】：
-
我没有注意到跳跃。你用的是什么浏览器？
-
我没有注意到使用谷歌浏览器的跳跃。
-
Chrome 20，Win 7 - 所有图像的行为都相同，没有跳跃。
-
应该先检查所有浏览器。在 Chrome、IE 和 Safari 中都看不到它，但 Firefox 13.0.1 会“跳跃”（也会在两个不同的显示器上）。
-
Firefox 是罪魁祸首。歌剧很好。