在html中的图片之间的下划线

Question

我试图将多个图标（图片）放在一行中，当我这样做时，我会在每张图片之间得到下划线。

＆＃13;

＆＃13;

<a href="https://www.facebook.com" target="_blank"> <img alt="Facebook" src="Facebook.png"> </a> 
<a href="https://www.youtube.com" target="_blank"> <img alt="Youtube" src="Youtube.png"> </a> 
<a href="https://twitter.com" target="_blank"> <img alt="Twitter" src="Twitter.png"> </a> 
<a href="http://www.instagram.com" target="_blank"> <img alt="Instagram" src="Instagram.png"> </a>

＆＃13;

＆＃13;

＆＃13;

这就是它的样子

参见附图，注意每张图片之间的下划线。

Answer 1

删除img中tag标记后的空格，该标记被视为字符，默认a标记具有下划线（CSS text-decoration属性）。

＆＃13;

＆＃13;

<a href="https://www.facebook.com" target="_blank"><img alt="Facebook" src="Facebook.png"></a>
<!--                                              -^-                                    -^-   -->
<a href="https://www.youtube.com" target="_blank"><img alt="Youtube" src="Youtube.png"></a>
<a href="https://twitter.com" target="_blank"><img alt="Twit11ter" src="Twitter.png"></a>
<a href="http://www.instagram.com" target="_blank"><img alt="Instagram" src="Instagram.png"></a>

＆＃13;

＆＃13;

＆＃13;

Answer 2

由于<a>代码和<img>代码之间的空格。

＆＃13;

＆＃13;

<a href="https://www.facebook.com" target="_blank"><img alt="Facebook" src="Facebook.png"></a> 
<a href="https://www.youtube.com" target="_blank"><img alt="Youtube" src="Youtube.png"></a> 
<a href="https://twitter.com" target="_blank"><img alt="Twitter" src="Twitter.png"></a> 
<a href="http://www.instagram.com" target="_blank"><img alt="Instagram" src="Instagram.png"></a>

＆＃13;

＆＃13;

＆＃13;

浏览器认为您处于链接字符串中，即使有图像也是如此。所以它会像往常一样强调链接。

＆＃13;

＆＃13;

a{
  text-decoration:none;
}

＆＃13;

<a href="https://www.facebook.com" target="_blank"> <img alt="Facebook" src="Facebook.png"> </a> 
<a href="https://www.youtube.com" target="_blank"> <img alt="Youtube" src="Youtube.png"> </a> 
<a href="https://twitter.com" target="_blank"> <img alt="Twitter" src="Twitter.png"> </a> 
<a href="http://www.instagram.com" target="_blank"> <img alt="Instagram" src="Instagram.png"> </a>

＆＃13;

＆＃13;

＆＃13;

Answer 3

使用以下代码：

a {
  text-decoration: none;
}