Outlook 不支持 HTML 边距答案

【问题标题】：HTML margins not supported in OutlookOutlook 不支持 HTML 边距
【发布时间】：2013-12-19 07:30:03
【问题描述】：

我正在开发一个电子邮件模板，它的间距是动态的，所以我将位置设置为边距，例如：

<td width="264px" bgcolor="#9ac5db" style="font-family:arial;font-size:12px;color:#000000;padding: 10px 5px 30px;" valign="top">
    <div name="nltitle" id="nltitle" style="font-family:arial;font-size:14px;color:#000000;display:block;text-align:center;margin:15px 0px 15px 0px;"><b>Test App</b></div>
                             
    <hr width="100%" color="#ffffff" size="3px">
                                         
    <div style="margin:10px 10px 30px 10px;text-align: left">
        Test App       
    </div>                             
</td>

这里我使用填充和边距来动态设置空格，但它在 Outlook 中不起作用。我该如何解决这个问题？非常感谢任何帮助。

干杯，

乔治

【问题讨论】：

对于 html 电子邮件模板，如果您希望在大多数电子邮件客户端中具有相同的外观，请仅使用表格；）顺便说一句，您之前没有在第一行中用" 关闭style 标记valign="top".
@mdesdev.我忘了把那个 (") 放在问题中。有没有其他方法可以替换填充和边距，因为它在 Outlook 中不起作用（这是因为我正在生成动态间距）
"替换填充和边距？"你可以在你想要顶部/底部间距的地方添加<td height="30" valign="top">&nbsp;</td>，也不要忘记像colspan和rowspan这样的属性。
更多关于litmus.com/help/email-clients/outlookcom-margins周围的margin word的信息

标签： html css email outlook margin

【解决方案1】：

答案很简单

而不是这个给

margin:10px 10px 30px 10px;

请用这个

Margin:10px 10px 30px 10px;

George 先生使用 div 也不好

【讨论】：

【解决方案2】：

Outlook.com 不支持边距，因此通常您应该在 html 电子邮件设计中避免使用它。而是像 mdesdev 建议的那样使用带有 &nbsp; 的填充或分隔表格单元格。

其他一些提示：

您应该删除 width="" 声明中的“px”
添加备用字体，因为非 Windows 用户没有 Arial
不要使用 CSS text-align:left;，而是使用 HTML align="left"
您不需要 div，您可以使用所有表格
您可能需要将您的速记 padding 值分隔为 padding-top、padding-bottom 等。根据记忆，我认为在某些电子邮件客户端中编写速记可能存在问题。

比您要求的更多信息，但我希望它会有所帮助...

【讨论】：

这似乎适用于大多数前景 ' '创造空间。
实际上，您不应该使用width= 或align=，而是使用CSS。这是一些文档：developer.mozilla.org/en-US/docs/Web/HTML/Element/td
@Cthulhu 你不正确。 HTML 电子邮件不遵循当前的网络标准。这是关于 HTML 电子邮件最佳实践的bunch of references
@John 谢谢你的链接，很多有用的资源。
@John 填充在 html 电子邮件中有效吗？据我所知，我认为它不适用于 html 电子邮件。