从Outlook发送到Gmail的HTML电子邮件会添加额外的空格

Question

如果我在Gmail或Outlook中打开以下HTML电子邮件，它会呈现出应有的样子：

<img src="img.png" />

然而，如果我在Outlook中打开它，然后将其转发到Gmail，它会添加额外的垃圾HTML，使区域比应该更高（'p'标签负责增加高度-具体为3px）：

<p class="MsoNormal">
    <span style="font-size:10.0pt">
        <img src="img.png">
        <u></u>
        <u></u>
     </span>
</p>

有许多解决方法可以修复Gmail中的间距问题，例如在图像中添加display:block、将字体大小和行高设置为0等等。我尝试了十几种方法，但由于幕后HTML修改不受我的控制 - 样式和属性被剥离，具有自己属性的标签被添加等等，所以都没有成功。

是否有一种解决方法可以始终保留原始格式？如果需要任何其他详细信息，请告诉我。

- StronglyTyped

---

转发邮件总会对渲染和功能造成问题。通常，像MailChimp这样的大多数发送系统都会添加一个转发给朋友的功能，以解决这个问题。 - samanthasquared

Answer 1

这个问题没有固定的解决方法，但有办法可以限制和隐藏分隔符的大小。我将把它称为“分隔符”，但实际上是由于Outlook应用了mso-normal p标签而导致顶部单元格扩展。 这里有一篇相关文章。 表格之间的间隔比表格行之间的间隔大（约15像素）。虽然更复杂，但尽量将所有不能分离的内容放入一个大表格中。如果正确设置，合并列和行可以解决问题。

为了隐藏分隔符，请使用bgcolor设置将所有表格包装在主内容表格中。例如，制作一个白色的大内容窗格。从Outlook发送时，所有子表格都会移动，但间隙仍将保持为白色，防止不需要的线条出现在电子邮件正文中。

页脚技巧-将页脚表格设置为主白色面板的最后一个子表格，当它分离时，它将在其下方创建一条白线。要么将页脚表格从主面板中删除，要么将单元格bgcolor设置为与电子邮件背景相同以隐藏此分隔符。

- John

---

嗨@John，我只有一个在foreach循环中创建的带有tr标记的表格，并且我遇到了MsoNormal p标记添加空格的问题。你能给我提供一个解决方法吗？ - coder771

Answer 2

我通过改变MsoNormal类来改变这种情况。

 <style>
    td p.MsoNormal {margin: -4px !important}

    /* ou */

    .MsoNormal {
        margin: -4px !important;
    }
 </style>

- Samuel Souza