HTML 链接图像问题答案

【问题标题】：HTML Linked Images IssuesHTML 链接图像问题
【发布时间】：2015-05-04 20:36:55
【问题描述】：

在处理 HTML 电子邮件签名时，我为四个链接的图像编写了基本的 HTML。

<a href="http://www.dwightfund1.com">
<img src="https://dwight.app.box.com/representation/file_version_28131628265/image_2048/1.png?shared_name=x116s7oza2gydr9tmlqgv7oad349y885" width="40" height="40" alt="capture"/>
</a>
<a href="http://www.dwightfund2.com">
<img src="https://dwight.app.box.com/representation/file_version_28131627701/image_2048/1.png?shared_name=97bbaqds6wg6up5ip12a5t55lts7mnd4" width="40" height="40" alt="capture" border="0">
</a>
<a href="http://www.dwightfund3.com">
<img src="https://dwight.app.box.com/representation/file_version_28131629073/image_2048/1.png?shared_name=w9ucedcax4fmcw3lelwl9rhgdbhyqvo4" width="40" height="40" alt="capture"/>
</a>
<a href="http://www.dwightfund4.com">
<img src="https://dwight.app.box.com/representation/file_version_28131628619/image_2048/1.png?shared_name=a3t36efnz0cs3kmcza2an0wehrnczu48" width="40" height="40" alt="capture"/>
</a>

当我在浏览器中查看代码时，这些奇怪的行会出现在如下图像旁边：

为什么会有这些线，我该如何删除它们？

【问题讨论】：

好像是border..把border=0这样就可以解决了

标签： html image web hyperlink

【解决方案1】：

它们可能是图片之间空格中链接的默认text-decoration: underline。

如果这是针对电子邮件客户端（不支持 CSS 样式表），您可能需要执行类似的操作

<a style="text-decoration: none" href="http://www.dwightfund4.com">

【讨论】：

好主意！感谢帮助。

【解决方案2】：

此边框旨在告知用户该图像是一个链接。

a{
   text-decoration: none;
}

img{
  border-style: none;
}

【讨论】：

【解决方案3】：

你可以用元素的颜色来移除它：

http://codepen.io/fedojo/pen/NqGKNX

例如：<a href="http://www.dwightfund1.com" style="color: #fff">

【讨论】：

您还应该请求相关的 CSS 文件，谁知道这可能会造成问题。如果没有关联外部 CSS，那么您的答案是正确的