Html a：将背景悬停在img内

当我将鼠标悬停在链接的图像上时，我看到图像下方的背景色悬停。如何避免这种情况

是否有任何解决方案不涉及对

a

元素应用特殊类（如

a.nobackground:hover

）

CSS:

HTML:

如果图像（在本例中为.png）下没有非纯色（或图形），则将img background设置为任何其他颜色即可

---

设置图像的背景色是否符合您的要求

a img {
    background: none;
}

根据您的样式表，您可能需要

！重要信息

在“无”前面砰的一声覆盖其他条件

编辑：再三考虑，您可能希望显式设置颜色值，而不是简单地说“无”

另一种编辑：如果透明PNG后面的颜色或背景不是纯色，您将遇到一些问题。另一种选择是：

<a href="#" class="transparent_png"></a>

---

因此，在这里，您实际上没有使用图像标记，但可以覆盖通常应用于：hover和：active的background color属性。这行吗？

如果我正确理解了这个问题。。。您需要将一个特殊类应用于该特定链接，或者根据其位置调用该链接（如果它与其他链接不同）。例如：

div div div a {}

---

正如马特所说，你可能需要使用！重要的是，您有一个规则，其中包括页面中的所有链接。我推荐一个不同的类，从语义的角度来看更好。

但是你必须记住添加display:block to.transparent\u png并给它高度和宽度啊，谢谢。。。我真傻。如果“块”显示成为设计中的一个问题，Memke，您可以尝试内联块。

a img {
    background: #000 !important;
}

a img {
    background: none;
}

<a href="#" class="transparent_png"></a>

.transparent_png {
    background-image: url('with_transparency.png');
    background-color: transparent;
    display: inline-block;
    width: ??px;
    height: ??px;
}

div div div a {}