繁体   English   中英

为什么在firefox,Internet Explorer,Chrome Web浏览器中,我的电子邮件模板显示正确对齐,但是在Microsoft Outlook电子邮件阅读器中却损坏了?

[英]Why in firefox, internet explorer, chrome web browser my email template show correctly aligned, but in Microsoft outlook email reader it gets broken?

我有一个模板,该模板用于发送纯CSS手工编写的电子邮件,然后在Firefox / InternetExplorer / Chrome浏览器中进行了测试。 但是当我将该电子邮件发送给我的上司PC时,他始终是Microsoft Outlook用户。

他总是使对齐方式断开,所有问题都从文本断开处开始。 我的问题是你怎么写呢? 没有任何网络浏览器显示我的模板错误。

我进行了很多搜索,但是大多数答案对此的回答都不够深入和正确。 我非常感谢一些专家对此提供的意见。

谢谢

Outlook使用CSS渲染引擎Trident的较旧版本。 根据老板的工作状况,情况可能会变得更糟。 由于微软在与欧盟的反托拉斯诉讼中败诉,Outlook 2010实际上还原为Trident的较旧版本,因此,2010年之前的任何版本实际上都呈现出更好的效果,但是它们都比最好的要差。 您将要真正停止使用现代html / css进行开发,而退回到旧的学校表格布局上。 我知道,它的毛额很大,但是您必须通过电子邮件进行处理。 最好的测试是本机测试,但是如果您不能同时使用这两个版本(不是很多版本),则应查看EmailOnAcid.com,它们会提供大量可以测试的电子邮件客户端。 如果您还有其他需要,constantcontact.com,mailchimp.com和campaignmonitor.com都提供比测试服务更多的功能。

Outlook 2007是坏人。 任何较新或更旧的都更好。 在Outlook 2007中,许多CSS命令无效。

请参阅此页面: http//www.email-standards.org/了解详细信息。

然而,尝试发送电子邮件到Gmail.com,看看它是如何显示在Gmail网络界面- Gmail是相当严格,作为一个经验法则,如果它显示很好,它应该在其他Web客户端也很好。

有关HTML电子邮件的一些建议:

  • 外表
    • 最好为Outlook提供width ,否则CSS可能会崩溃。
    • Outlook不支持<div> s / <p> s, float和其他各种内容的padding
  • 邮箱
    • 对于Gmail,您应该优先使用内联CSS来定义类。
    • Gmail实际上会解析您提供的CSS,例如,将height更改为min-height因此使用height是没有用的。 但是,浏览器不考虑<td> min-height ,因此可以使用<td>内的内部<div>来确保应用了min-height。
    • Gmail会去除背景图片,出于安全原因,通常在所有电子邮件客户端中应用户请求显示图片。 因此,用<div>包装图像并设置背景颜色和该外部div颜色,并为图像提供alt (替代文本)(另请注意,具有src为空的图像在浏览器呈现时不会保留宽度和高度)。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM