HTML电子邮件中的间距

时间:2011-05-17 14:11:09

标签: html css email html-email

我正在设计一个小应用程序,可以通过电子邮件发送6个具有共同内容的设计模板之一。

保持文本的空间和布局(行间等)的最佳(最一致)方法是什么

我们考虑使用简单的<br>,但与其他东西相比,我们可能会失去一些灵活性。这是一个基于表格的布局

干杯

4 个答案:

答案 0 :(得分:2)

您应该在电子邮件标记中使用内联样式。

以下是如何在电子邮件构建中一致地分隔段落的示例

<p style="margin:0 0 15px 0;padding:0;line-height:value;font-size:value">Insert Paragraph information here</p>
<p style="margin:0 0 15px 0;padding:0;line-height:value;font-size:value">Insert Paragraph information here</p>

答案 1 :(得分:2)

帮自己一个忙,花一些时间阅读来自Acid on Acid的文章7 Tips Regarding Margins and HTML Padding in Emails

它会有很大的帮助!我很认真......

答案 2 :(得分:1)

雅虎(可能还有其他电子邮件客户端)以不同于其他大多数人的方式解释<p> - 很难让雅虎看起来<p>,而不会让所有其他人看错。根据我的经验,通过使用<br />以及行高,当然还有字体大小,您可以更好地控制间距/格式。您可以为<br />标记提供内联line-height样式,以便更具体地调整间距。

<强>然而

  • Outlook 2007/2010倾向于忽略line-height属性。
  • 所有电子邮件客户端都使用和/或忽略margin个样式。在可能的情况下使用padding而不是margin会更可靠。

最佳间距&amp; HTML-for-email中提供的布局控件(如您所知,仅限于基于表格的布局和内联样式)是将文本的行/段落分隔为不同的表格单元格/行,并使用{{1}控制间距}&amp; width元素height。使用此方法,您几乎总是拥有<td>

答案 3 :(得分:0)

今天最好的方法是每行使用一个p元素,并使用CSS。

您应该考虑用div和CSS样式替换大多数基于表格的布局(显然,除非您需要具有相同高度的水平元素)。

如果你要陈述一个特定问题,我的回答会更好:“如何用HTML实现这个<insert image here>?”