Outlook 2007/2010 中的 Vspace答案

【问题标题】：Vspace in Outlook 2007/2010Outlook 2007/2010 中的 Vspace
【发布时间】：2012-05-16 08:10:38
【问题描述】：

我有一个 html 时事通讯，它适用于大多数电子邮件运营商，但在 Outlook 中格式混乱。我已将 vspace="10" 放在图像标签上，以便在图像的顶部和底部放置 10px 的边距，以便在图像和其下方的文本之间留出空间。但是，在 Outlook 中，vspace 没有被拾取，文本直接显示在图像下方，中间没有空格。

有谁知道如何让它工作？我尝试在图像上放置 10px 的 margin-bottom，但这同样不起作用。

【问题讨论】：

标签： html email outlook html-email

【解决方案1】：

使用嵌套表格并将行高定义为 10 像素可能会更容易。您在 Outlook 2007+ 中遇到的问题是 Word HTML 渲染，它以自己的特殊方式处理 CSS。

【讨论】：

【解决方案2】：

对于 HTML 电子邮件，不同浏览器之间存在许多细微差别。我从创建电子邮件中学到的一件事是它需要非常简单。 Outlook 不支持边距和内边距（因为它使用了文字渲染引擎）。

解决办法

将图像和空格替换为包含 2 个间隔 gif 和图像在中心的表格。例如（您需要使用图像的绝对路径）：

<table cellpadding="0" cellspacing="0">
  <tr>
    <td>
      <img style="display:block" border="0" src="images/spacer.gif" width="IMAGEWIDTH" height="10" />
    </td>
  </tr>
  <tr>
    <td>
      <img style="display:block" border="0" src="YOUR IMAGE" width="" height="" />
    </td>
  </tr>
  <tr>
    <td>
      <img style="display:block" border="0" src="images/spacer.gif" width="IMAGEWIDTH" height="10" />
    </td>
  </tr>
</table>

【讨论】：