Question

多年来我没有发过任何邮件，我记得这个过程非常痛苦。

我已将我的设计分为三个部分，并将它们放在一个表格中，表格的高度和宽度已定义，所有单个元素也是如此，但是在Gmail等电子邮件客户端中查看时，三者之间有空格表行。

我的HTML。我想你会同意它不能简化！

<table border="0" cellpadding="0" cellspacing="0" width="550" height="550">
 <tr>
  <td colspan="2" bgcolor="#ffffff" width="550" height="104">
<img src="images/OC_01.gif" alt="" width="550" height="104"></td>
 </tr><tr>
  <td bgcolor="#ffffff" width="246" height="341">
<img src="images/OC_02.gif" alt="" width="246" height="341"></td>
  <td bgcolor="#ffffff" width="304" height="341">
<img src="images/OC_03.gif" alt="" width="304" height="341"></td>
 </tr><tr>
<td colspan="2" bgcolor="#014280" width="550" height="105" valign="top">
<a href="TBA"><img src="images/OC_04.gif" alt="" width="550" height="105"></a></td>
 </tr>
</table>

今天有没有人有足够的电子邮件HTML体验指向我正确的方向？

编辑添加：我一直在分析过去发给我的一些商业电子邮件，我发现其中一些也在Gmail中存在这种奇怪的间距问题。我还注意到，每个设计都是为了容纳行之间的任何额外间距，所以我将假设这个问题的答案是确保设计以这样的间隙产生不是问题。

Answer 1

您必须在所有图片中加入style =“display：block”，以防止各种电子邮件客户端出现间隙问题。

示例：

<img src="http://www.website.com/images/kitty.jpg" alt="Picture of Kitty" 
 width="1000" height="1000" 
 style="border:none; margin:0px; padding:0px; **display:block;**"/>

html电子邮件问题与布局

1 个答案: