html - Gmail 移除内联 CSS

Question

我在创建的 HTML 电子邮件中的图像之间一直存在间隙问题。我从在线指南中了解到，在 img 标签上使用 display: block 是一种简单的解决方法。然而，gmail 现在似乎删除了所有内联 CSS。

我使用 Chrome 浏览器。我还在 Firefox、Opera、Safari 和 IE 中对此进行了测试。这个问题对他们所有人来说都是一样的。

这也会影响 td 标签上的行高问题。已知一些差距是由行高问题引起的，以前的内联 css 是一种解决方案。但是，现在我无法编写内嵌或嵌入的 css 来覆盖 gmail 应用的内容。

有人知道当前的解决方法或解决方案吗？

例如，以下不适用于使用 Chrome 的 gmail - gmail 删除了 css:

<table width="700" cellpadding="0" cellspacing="0" border="0" height="592">
    <tbody style="line-height:0px;padding:0;margin:0;" width="700" height="592">
    <tr width="700" height="296">
        <td style="line-height:0px;" width="441" height="296">
            <a href="[the url]" target="_blank" width="441" height="296">
                <img src="[the url]" style="display:block;border:0;" width="441" alt="[the alt text]" height="296"/>
            </a>
        </td>
        <td style="line-height:0px;" width="39" height="296">
            <img src="[the url]" style="display:block;border:0;" width="39" height="296"/>
        </td>
        <td style="line-height:0px;" width="220" height="296">
            <a href="[the url]" target="_blank" width="220" height="296">
                <img src="[the url]" style="display:block;border:0;" width="220" alt="[the alt text]" height="296"/>
            </a>
        </td>
    </tr>
    <tr style="line-height:0px;" width="700" height="296">
        <td style="line-height: 0px;" width="441" height="296">
            <a href="[the url]" target="_blank" width="441" height="296">
                <img src="[the url]" style="display:block;border:0;" width="441" alt="[the alt text]" height="296"/>
            </a>
        </td>
        <td style="line-height:0px;" width="39" height="296">
            <img src="[the url]" style="display:block;border:0;" width="39" height="296"/>
        </td>
        <td style="line-height:0px;" width="220" height="296">
            <a href="[the url]" target="_blank" height="296">
                <img src="[the url]" style="display:block;border:0;" width="220" alt="[the alt text]" height="296">
            </a>
        </td>
    </tr>
    </tbody>
</table>

PS - 我知道有些标签不需要这些属性 - 我添加它们是出于测试目的，目的是详尽无遗，并确保尽可能多地声明。

Answer 1

测试应用程序或 outlook 可能正在修剪内联样式。

请尝试 align:left 代替 display:block。