1

在这段 html 中，

    <div>
        <a href="http://www.facebook.com/" target="_blank">
            <img border="0" width="26" height="25" src="facebook.gif" alt="Facebook"/>
        </a>
        &nbsp;&nbsp;&nbsp;
        <a href="http://twitter.com/" target="_blank">
            <img border="0" width="26" height="25" src="twitter.gif" alt="Twitter"/>
        </a>
    </div>

当它显示在浏览器中时，第一张图像旁边有一个小标记。为什么会出现，我该如何删除它？

这是一张图片来展示它：

在此处输入图像描述

4

4 回答 4

5

只需尝试text-decoration: none为上面的两个链接设置。

您面临的问题是链接默认带有下划线，并且在导致空白字符的图像之后可能有换行符，并且默认情况text-decoration: underline;下在该空白字符下显示下划线。

于 2013-10-11T06:30:22.527 回答
1

我不知道原因，因为我也为此苦苦挣扎了很长时间（与空白有关）。但是，我发现如果将显示设置为 inline-block，这个问题就会消失。

a { display: inline-block; }

看到这个小提琴：http: //jsfiddle.net/mznMY/

于 2013-10-11T06:31:47.450 回答
1

<img ...>像这样删除和之间的空白</a>：

<div>
    <a href="http://www.facebook.com/" target="_blank">
        <img border="0" width="26" height="25" src="facebook.gif" alt="Facebook"/></a>
    &nbsp;&nbsp;&nbsp;
    <a href="http://twitter.com/" target="_blank">
        <img border="0" width="26" height="25" src="twitter.gif" alt="Twitter"/></a>
</div>
于 2013-10-11T06:30:48.073 回答
1

您正在使用a包含下划线符号的锚点

放到text-decoration: none你的a.

于 2013-10-11T06:37:43.760 回答