我一直在创建我的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 - 我知道有些标签不需要这些属性 - 为了测试目的,我已将它们添加为详尽无遗并确保尽可能多地声明。
答案 0 :(得分:1)
测试应用程序或outlook可能会修剪内联样式。
请尝试align:left
而不是display:block
。