html - 如何删除链接图像的灰色突出显示？

Question

我在我的 MVC4 网站上添加了一个图像作为链接，当我将鼠标悬停在图像上时，会出现一个令人讨厌的灰色突出显示，有没有办法删除它？

下面是我的代码：

<div class="float-left">
  <p>  
    <a href="@Url.Action('Index')">
      <img alt="HomePage" style="verticalalign:middle;" height="30px" src="~/Images/formvalue_logo.png"> 
    </a> 
  </p>
</div>

提前致谢。

Answer 1

尝试 -

.float-left img:hover, .float-left a:hover{
  background: none;
  background-color: transparent;
}

Answer 2

a img, a img:hover { background-image: none; background-color: transparent; }

可能会解决您的问题...如果没有，请尝试：

a:hover img, a img:hover { background-image: none; background-color: transparent; }

如果这不起作用，那么背景在“a”标签上而不是图像上，你需要这样做：

a { background-image: none; background-color: transparent; }

虽然这会影响页面上的每个链接，所以最好在链接上放置一个类（例如 myClass），并使用它来设置样式：

a.myClass, a.myClass img, a.myClass img:hover { background-image: none; background-colour: transparent; }