悬停时的不透明度变化会导致图像偏移或失真

Posted 2023-03-06

【中文标题】悬停时的不透明度变化会导致图像偏移或失真

【英文标题】：Opacity change with hover creates an image shift or distortion

【发布时间】：2014-03-10 04:04:40

【问题描述】：

我有一个jsfiddle here，它表明使用a:hover，更改不透明度会改变（或扭曲）图像。

这在 Firefox 中可见。

有人可以解释可能发生的情况以及如何防止图像发生变化吗？提前致谢。

【参考方案1】：

我在this so post找到了答案。

对我来说，解决方案是在 img 上使用以下内容

-webkit-transform: rotate(0);
-moz-transform: rotate(0);
transform: rotate(0);
-webkit-backface-visibility: hidden;