html - 如何删除损坏的图像框？

Question

我正在尝试构建一个电子邮件模板，我必须在其中向不同的邮件客户端(例如.. outlook、thunderbird...)显示一些图像。现在的问题是，当这些客户端不允许显示图像时，我不想显示损坏的图像框。

我也引用过

引用链接 1 : How to remove borders around broken images in webkit?

引用链接[2]:input type="image" shows unwanted border in Chrome and broken link in IE7

引用链接[3]:How to stop broken images showing

但无法找到任何合适的输出。注意:我不能使用 div 标签。我必须使用表格标签。

CODE 我正在使用什么:

<table style="background:#fff; width:600px; margin:auto auto;">
<tr>
    <td>
    <a href="http://www.sampleurl.com">
    <img src="http://sampleimageurl.com/sampleimage.png" height="55" width="198" />
    </a>
    </td>
    <td style="text-align:right;"><a href="http://www.sampleurl.com" target="_blank">
        <span style="font-family:Myriad Pro; color:#0d5497; font-size:20px;">www.sampleurl.com</span>
    </td>
</tr>

<!--<tr>
    <td colspan="2" style="height:1px; background: #0d5497;"></td>

</tr>-->

输出我得到的。

Answer 1

在这里使用 alt 进行回退

demo

html

<img src="abc" alt="image" />

CSS

img {
    width:200px;
    height:200px;
}

或者，如果您不想显示任何alt text，只需留一个空格即可。

demo here

HTML

<img src="abc" alt=" " />