在 HTML 电子邮件中创建简单分隔符的最可靠方法是什么？

Question

我尝试使用带有单列的表格行，该列仅包含空锚元素并具有背景颜色。这对某些客户有效，但我不会说大多数。我也尝试过设置列和行的边框底部，但这也有非常复杂的结果。另一种选择是使用图像...

有什么可靠的技术可以做到这一点吗？我对电子邮件设计相当陌生。

Answer 1

有多种方法，如果您想要在段落下使用水平“规则”，完整段落宽度，您可以：

<td bgcolor="#ffffff" style="border:none; border-bottom: 1px solid #cccccc;">My text plus at least two break tags for padding <br /><br /></td>

或者

<tr>
<td bgcolor="#FFFFFF" style="Verdana;">Some content text here with no break tag after it.</td>
</tr>
<tr>
<td height="1" bgcolor="#ffffff" style="border:none; border-bottom: 1px solid #cccccc; font-size:1px; line-height:1px;">&nbsp;</td></tr>

第二种方法可能会在布局中添加两个像素，具体取决于使用的电子邮件客户端和渲染方法。但更可靠，因为您可以设置高度以在文本下象征性地添加“填充”。（填充在所有电子邮件客户端中的单方面工作方式并不相同）。

对于更复杂的“填充”选项，我建议将其添加border-bottom到封闭的表格中<td>，然后嵌套带有额外“填充”列的表格*使用Outlook hack 的font-size:1px; line-height:1px;"加号 。