email - MS Outlook 中的小行高渲染不正确

Question

通过做一些研究，我发现 MS Outlook 不会在小于 16 像素的 HTML 电子邮件中呈现行高。

这有点问题，因为我真的需要它更小。

有谁知道解决这个问题？？

Answer 1

你用的是什么代码？它会低于 16 像素，但前提是字体大小为 14 像素或更小。此外，请确保您在父 TD 上设置 line-height - 即在最近的块级元素上，而不是在行内元素上。

Answer 2

确保您有 0 填充和边距，所有内联内容（尤其是图像！）都有“display:block”，并将 line-height 设置为您期望的高度。

Outlook <2007 使用 IE 作为渲染引擎，2010 使用 WORD。

是的，它很蹩脚。

Answer 3

这个 CSS 可能会解决这个问题，但它只适用于块元素（p、div、..etc）：

mso-line-height-rule:exactly; line-height:10px;

如果您尝试创建垂直间距，请使用line-heightandfont-size强制高度：

line-height:5px;font-size:5px;height:5px;

Outlook.com (Hotmail) 将line-height用他们的 CSS 覆盖您的 CSS，因此您需要在他们修改 CSS 后使用它来“重置”您的 CSS：

.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font,
  .ExternalClass td, .ExternalClass div {line-height: 100% !important;}

Outlook.com 继续：然后，如果您有任何元素，line-height:0您将需要给它们一个 id 属性，然后专门重置那些：

.ExternalClass #elementWithNoLineHeight { line-height:0 !important; }