用背景颜色填充png图像的alpha通道

Question

我正在使用带有Alpha通道的.png图片来更改悬停时的图像。什么时候 我将图像悬停在背景颜色变化的位置。所以看起来图像会发生变化。 但现在我有一个问题。这适用于所有浏览器，但不适用于Firefox。在firefox中，有一段细线出现在图像旁边。我怎样才能确保不会发生这种情况。

这是wat发生在firefox：

这就是应该看起来的样子。

Answer 1

您无法为一个元素分配2个背景，因此您需要使用如下所示的2个元素：

＆＃13;

＆＃13;

.object{
  float: left;
  border: 1px solid #FFF;
}
.object:hover{
  background: #FEF;
  border: 1px solid #F00;
}

＆＃13;

<div class="object">
  <img src="https://wiki.videolan.org/skins/common/images/vlc_wiki.png"/>
</div>

＆＃13;

＆＃13;

＆＃13;