Gmail 删除内联 CSS

Question

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

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

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

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

例如，以下内容不适用于使用 Chrome 的 gmail - css 已被 gmail 删除：

<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。

Gmail 删除内联 CSS

Gmail removes in-line CSS

html

css

email

gmail