Outlook HTML电子邮件的边框宽度不一致

Outlook HTML电子邮件的边框宽度不一致,html,outlook,html-email,newsletter,Html,Outlook,Html Email,Newsletter,我正在创建一封html电子邮件,我需要在表格之间添加一些垂直间距。为了解决Outlook 2007、2010和2013中不支持页边距顶部和页边距底部的问题,我决定使用完全支持的边框样式在表格之间添加间距 我在表的底部添加了一个边框,并运行它以获得以下内联样式: <table align="center" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing

我正在创建一封html电子邮件,我需要在表格之间添加一些垂直间距。为了解决Outlook 2007、2010和2013中不支持页边距顶部和页边距底部的问题,我决定使用完全支持的边框样式在表格之间添加间距

我在表的底部添加了一个边框,并运行它以获得以下内联样式:

<table align="center" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; width: 600px; border-bottom-width: 20px; border-bottom-color: #f3f2ef; background-color: white; border-style: none none solid;" bgcolor="white">

不过,Outlook 2007、2010和2013的边框宽度比其他电子邮件客户端的边框宽度要小得多。我把结果放进photoshop,在8px处测量,应该是20px


有人能告诉我是什么导致了这种差异吗?

如果您愿意放弃使用border,我可能会有另一种解决方案

根据我的经验,border不可靠,因此我通常在td中使用透明间隔gif,如下所示:

<tr>
  <td bgcolor="#f3f2ef">
    <img src="http://www.yourdomain.com/images/spacer.gif" style="display:block;" width="1" height="20" alt="">
  </td>
</tr>


将此列作为表中的最后一行,您应该被设置

您可以通过创建包含
的表来使用间隔GIF。例如:

<table width="600" cellpadding="0" cellspacing="0" align="left">
  <tr>
    <td width="20" bgcolor="#959595">&nbsp;</td>
    <td width="560" bgcolor="#959595" style="padding: 0px;">&nbsp;</td>
    <td width="20" bgcolor="#959595">&nbsp;</td>
  </tr>
  <tr>
    <td width="20" bgcolor="#959595">&nbsp;</td>
    <td width="560" bgcolor="#FFFFFF" style="padding: 20px;">&nbsp;<br>Content<br>...<br>&nbsp;</td>
    <td width="20" bgcolor="#959595">&nbsp;</td>
  </tr>
  <tr>
    <td width="20" bgcolor="#959595">&nbsp;</td>
    <td width="560" bgcolor="#959595" style="padding: 0px;">&nbsp;</td>
    <td width="20" bgcolor="#959595">&nbsp;</td>
  </tr>               
</table>


内容


我同意DevinKoncar的观点,即图像有时是唯一的解决方案,但我最后一次迫切想使用它是在几年前。顺便说一句,这些图片的命名对你的垃圾邮件评级很重要,所以不要使用“间隔符”或“像素”,而是按颜色命名(如white.gif)。Outlook Online的预览窗格将在您尚未下载图像时更改图像的大小,这在几乎所有设计中都非常难看。不要使用PNG:一些MailClient(如Lotus Notes)在呈现方面有问题

如果您只想在两个表之间创建一个空格,那么只需使用BR标记,否?只需在周围的表格中设置字体大小和线条高度。唯一的限制是在表下面有一个BR标记,但两个标记之间从来没有问题

此外,您还可以将BR标记作为td中的唯一内容,并使用字体大小和行高创建所需的高度

    <table cellpadding="0" cellspacing="0" border="0" align="center" width="600"><tr><td bgcolor="#ffffff" style="font-size:20px; line-height:20px;"><br />
        <table cellpadding="0" cellspacing="0" border="0" align="center" width="500"><tr><td bgcolor="#f1f1f1" style="font-size:20px; line-height:20px;">Row 1</td></tr></table><br />
        <table cellpadding="0" cellspacing="0" border="0" align="center" width="500"><tr><td bgcolor="#f1f1f1" style="font-size:20px; line-height:20px;">Row 2</td></tr></table>
    </td></tr></table>

第1行
第2排
@irdesign-谢谢,我已经完成了这项工作,一切正常。我会把这个问题留一段时间不回答,看看是否有一个实际的解决办法,如果没有,我会标记你的答案。