为什么 Gmail 会阻止电子邮件中的 CSS？答案

【问题标题】：Why is Gmail blocking CSS in emails?为什么 Gmail 会阻止电子邮件中的 CSS？
【发布时间】：2010-12-06 00:36:20
【问题描述】：

我在电子邮件中使用了 CSS 并将其发送出去。

当我在 Gmail 中收到电子邮件时，所有 CSS 都被禁用；但是，当我在 Thunderbird 或 Outlook 中检索到电子邮件时，一切正常。

我该如何解决这个问题？

【问题讨论】：

现在不仅 Gmail，甚至 Outlook 似乎都在阻止非内联或阻止 css。他们都仍然接受内联 CSS，所以解决方法类似于 <p style="background-color: #000">Hello there</p>

【解决方案1】：

Gmail 不会完全阻止 CSS。它仍然支持内联样式。为什么它不支持样式块，我不知道。要对各种 webmail 和电子邮件客户端中的 CSS 支持有一个很好的概述，这里有一个很好的。 http://www.campaignmonitor.com/css/

【讨论】：

Gmail 是否支持样式标签。请确保将<style></style> 代码放入<head> 部分。
Gmail 没有。我刚刚测试了它。它似乎也无法识别 div 标签。
从技术上讲，它确实“支持”样式标签，但它剥离了所有类和 ID 样式。它可以读取一些基本样式，但仅此而已。这类似于我说我打鲨鱼是因为我打了鲨鱼毛绒玩具。
电子邮件客户端应该全部从 html 电子邮件正文中删除远程 css、javascript 等，并且永远不要加载它。这是一种安全措施，可用于缓解 Ropemaker 风格的攻击向量。
@Ruut：谢谢队友...这很有帮助，将样式标签放在头部！！

【解决方案2】：

Gmail 会阻止所有外部（引用）资产 - 样式表、图像、脚本等。这是为了保护收件人的隐私。您仍然可以包含内联样式：

<span style="color:red;">Red text</span>

【讨论】：

【解决方案3】：

如果您可以将样式嵌入到电子邮件中的类和 id 中，它们可能会意外地与 gmail 用于显示应用程序的样式发生冲突，或者被怀有恶意的人故意冲突。内联样式是标签的本地样式，因此不理会 gmail 样式。

Google 必须保护它为人们创造的用户体验。

【讨论】：

【解决方案4】：

样式表是许多 HTML 功能中的一种，这些功能经常被网络邮件提供商阻止。

HTML 邮件是一个充满伤害的世界，它不会变得更好 — 事实上，您可以期待它get worse。 some 邮件程序或网络邮件服务几乎不支持 HTML 的所有功能。任何现代的东西都是致命的损失。当然还有纯文本客户端。

除非您有无尽的空闲时间来烧毁您的代码并测试每一个邮件程序，否则忘记 HTML 邮件。只需发送一封带有指向正常网页链接的文本邮件，您就可以确保一切都会按预期进行。

【讨论】：

【解决方案5】：

另一个很好的信息来源是MailChimp EMail Template Reference。我发现开发部分特别有用，因为它包含有关 CSS GMail 支持什么以及如何利用它的信息。

【讨论】：

【解决方案6】：

我刚刚对此进行了测试，它确实支持内联样式，使代码有点难看，但你可以绕过它。

希望对您有所帮助。

【讨论】：

【解决方案7】：

我回答得太晚了，但这可能会对这里的人有所帮助。为了能够在 gmail 和其他电子邮件客户端中查看您的邮件，您需要为 html 中的每个标签添加内联样式，但是为每个 html 标签编写内联 css 非常耗时，为了节省您的时间，请使用内置工具

http://templates.mailchimp.com/resources/inline-css/

只需粘贴您的整个电子邮件模板，您将获得每个标签中带有内联 css 的 html 文档。就这么简单:)

注意：你可以在课堂上保持你的班级和身份。

【讨论】：

【解决方案8】：

如果您使用 Ruby on Rails 和 ActionMailer，您可以使用 gem ActionMailer Inline CSS。您所要做的就是安装 gem，它会自动内联邮件模板中的所有 CSS。从字面上看，这再简单不过了。

【讨论】：

【解决方案9】：

<style type="text/css"></style>

标签对我有用，但我确实遇到了一个问题，即我的所有 CSS 都无法正常工作，因为我错过了 ; 这是一个乏味的过程，但我最终找到了它。

link #9 from here 给了我初步提示，这可能是由于单独的 CSS 行。

【讨论】：