html - 从链接的图像中删除下划线

Question

我正在我的网站 (Wordpress) 上添加自定义社交媒体图标链接，并且有一条顽固的线条贯穿它们，就像超链接一样。当鼠标悬停在图像上时该线消失，只需链接页面上的其他超链接即可。

这是用于创建它们的代码:

.custom-social img {
  text-decoration: none;
  margin-right: 20px;
}

<div class="custom-social">
  <a href="http://twitter.com/mrsideproject">
    <img title="Twitter" alt="Twitter" src="http://coinpages.co/wp-content/uploads/2018/01/twitter-badge.png" width="35" height="35" />
  </a>
  <a href="http://medium.com/@mrsideproject">
    <img title="Medium" alt="Medium" src="http://coinpages.co/wp-content/uploads/2018/01/medium-logo.png" width="35" height="35" />
  </a>
  <a href="http://instagram.com/mrsideproject">
    <img title="Instagram" alt="Instagram" src="http://coinpages.co/wp-content/uploads/2018/01/Instagram-badge.png" width="29" height="30" />
  </a>
</div>

Answer 1

text-decoration 在 a 上，而不是在 img 上。