我目前正在编写 HTML 电子邮件，这简直是一场噩梦。我已经非常接近完美的设计，但我的修改处于一个客户的修复导致另一个客户的修复出现问题的阶段。我在某处（找不到）读到 Outlook 将 #outlook ID 应用于电子邮件正文。如果它发生在许多客户身上，这将改变生活......谷歌也无济于事 - 那么任何人都可以分享一些关于这个主题的明智之言吗？
谢谢，
~哈雷
【问题讨论】：
标签： css html-email email-client
我的智慧之言是基于对称为 HTML 电子邮件的噩梦的经验。 有些人总是将自己的垃圾应用于许多元素。所以当你问他们是否添加一个 ID 时，我问添加到什么？你的第一个元素？所有元素？是的。很多时候他们这样做。许多人不会乱来。取决于邮件客户端。
我为许多大客户写过 HTML 电子邮件。最后，最好的做法是回到原始的、老式的 html。忘记 CSS。如果您完全根据 4.0 过渡 HTML 的旧规则和代码盛行时期的所有劣质样式方法来设计和实施 HTML 时事通讯，那么您应该擅长所有客户端。
如果你愿意，你可以添加 css，但它的依赖关系可以而且很可能更像是一个补丁而不是一个解决方案。
【讨论】：
background-position: right -4px; webkit 的客户端中完美呈现它，但是其他多个正在加倍它。有点痛。特定的选择器将在很大程度上解决这个问题...感谢您的明智之言 :)
是的，Outlook 添加 ID、MSO 标记和大量其他废话的情况并不少见。只需在 HTML 电子邮件通过 Outlook 后查看其来源，您就会明白我的意思。
重要的是要让您的客户期望 HTML 电子邮件在所有电子邮件客户端中都不会是像素完美的。支持越来越好，但背景图像、CSS 和盒子模型充其量是不稳定的。
我能给出的最佳建议是从MailChip 模板开始，然后从那里开始工作。否则，基于表格的简单设计最适合所有客户端。
同样来自 MailChip (http://kb.mailchimp.com/article/top-html-email-coding-mistakes/)
链接的 CSS 文件并不总是适用于 HTML 电子邮件，因此您必须使用 内联或嵌入式 CSS。通常，当您编写网页代码时，您将 标签之间的嵌入式 CSS 代码。但是很多邮件 应用程序（尤其是基于浏览器的应用程序）去掉 HEAD 和 您的 HTML 电子邮件的 BODY 标记，因此您的 CSS 也会被剥离。
【讨论】：
这可能会有所帮助：
<html>
<body>
<!--[if gte mso 9]><![endif]–>
gte mso 9
<!–[if gte mso 9]><![endif]–>
<!--[if !gte mso 9]><!---->
!gte mso 9
<!--<![endif]-->
<!--[if !mso]><!-->
!mso
<!--<![endif]-->
</body>
</html>
【讨论】：