3

我一直在处理 HTML 电子邮件，并尝试了一切以line-height使其在 Microsoft Outlook Web App 中正确显示。我已经尝试过!important我的内联样式，.ExternalClass * {line-height: 100%}在文档头中使用，将文本包装在一个带有inline line-height样式的跨度中，line-height在父级td和span.

如果有人可以帮助它，将不胜感激！

下面是我当前文本在 td 中的一个区域的示例。

<td pardot-region="articleContent1a" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; font-family: sans-serif; font-size: 14px; line-height: 25px; text-align: left; color: #7f7f7f;" valign="top">
  Yesterday, Krissy posted about six things you should consider when performing a high-level user experience (UX) audit of a website. While UX is a crucial component of measuring a website’s success, it’s only part of the equation.</td>

我还尝试添加到 td mso-line-height-rule: 完全正确。

4

3 回答 3

3

我知道这是一个过去的问题，但我没有看到一个公认的答案。你有一个 jsfiddle 链接来查看你的代码吗？

您确实说过将嵌入式 CSS 覆盖设置为 100%；尝试将其设置为 112%：

.ExternalClass * { line-height:112%; }

Outlook Webmail 不会有您想要的确切行高，但它会覆盖 Webmail 添加的行高。

其他可能性：

  • 行高应在表格单元格中指定，<td>而不是任何内联标签（如<span>）。

  • 您使用的顺序mso-line-height-rule:exactly很重要 - 应在 mso-line-height-rule 之后立即声明行高：

    <td style="font-size:1em;mso-line-height-rule:exactly;line-height:1.3em;">

  • 最后一个选项，将每行文本放在自己的表格行/表格单元格中，并通过表格单元格在每行中使用填充来控制行高。

祝你好运。

于 2015-01-03T02:16:15.307 回答
2

将你的 line-height 增加三倍（body、td 和 spans）。确保在包含文本的每个 td 或 span 中为您的字体添加样式。不管指南告诉你什么，根据我的专业经验，你可以更好地使用“span”而不是“p”。

使用 Outlook 的条件样式：

table {
font-size:1px;
mso-line-height-alt:0;
line-height:0;
mso-margin-top-alt:1px;
}

当然; 您的电子邮件应该使用表格设计......但这是常见的做法。

于 2014-02-18T09:43:05.310 回答
1

根据这个 CSS support for email guide，line-height在 Outlook.com 的表格单元格中被忽略 - 他们建议尝试使用它p。

于 2014-02-17T00:42:52.530 回答