我注意到一个标准:悬停在图像上,这些图像以非原始宽度值显示,当鼠标悬停生效时会导致轻微的摇摆动画。我认为这是由于一些像素舍入发生,但为什么图像在悬停时显示不同?
请参阅http://jsfiddle.net/z29LM/8/
上的测试用例请注意,前两个图像在悬停时很好(因为它们使用原始图像宽度/高度),但所有其他图像似乎在右侧和底部添加了1个像素。应用哪种悬停效果似乎并不重要(例如,背景颜色会导致同样的问题)。
所以解决方法似乎是打开Gimp并手动将图像调整到目标宽度/高度,还是有针对这种现象的html / css修复?
编辑:
所以这似乎是一个只有Firefox的bug(使用13.0.1)。答案中发布的链接建议通过向图像元素添加box-shadow: #000 0em 0em 0em;
来快速解决问题。有关固定/工作版本,请参阅http://jsfiddle.net/z29LM/9/。