Gmail删除了内联CSS

时间:2015-11-11 13:27:56

标签: html css email gmail

我一直在创建我的HTML电子邮件中的图像之间的差距问题。我从在线指南中了解到,使用display:block on img标签可以轻松解决问题。然而,似乎gmail现在删除了所有内联CSS。

我使用Chrome浏览器。我也在Firefox,Opera,Safari和IE中测试了这个。所有这些问题都是一样的。

这也会影响td标签上的line-height问题。已知一些间隙是由线高问题引起的,之前的在线css是一种解决方案。但是,现在我无法在线编写css或嵌入以覆盖gmail应用的内容。

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

例如,以下内容对使用Chrome的gmail无效 - gss删除了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 - 我知道有些标签不需要这些属性 - 为了测试目的,我已将它们添加为详尽无遗并确保尽可能多地声明。

1 个答案:

答案 0 :(得分:1)

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

请尝试align:left而不是display:block