HTML 格式的邮件如何定义 CSS

发布于
2012-09-02

按照写网页的习惯，的把 css 写在 header 里，样式在 Outlook 和 Mail 客户端都能够正常显示。但是，发现在 Gmail 的 Web 界面上，移除了 body 及其外部的所有代码。
Email HTML 如下：

<!doctype html>
<head>
    <meta charset="UTF-8" />
    <style type="text/css">
        .title { color: red }    
    </style>
</head>
<body>
    <h2 class="title">Email title here</h2>
</body>
</html>

邮件发出后，在 Gmail 里看到的邮件内容代码只剩下了：

<h2 class="title">Email title here</h2>

如果想在 Gmail 里正确的显示样式，目前只发现下面的方式才显示正常：

<h2 style="color: red">Email title here</h2>

难道，整封邮件只能这样实现了么，有别的方法吗？

email css gmail html

阅读 35.6k

5 个回答

得票最新

xhinking

1.8k81820

发布于
2012-09-02

✓ 已被采纳

经过google搜索，发现gmail目前支持inline的css方式。

这里http://www.campaignmonitor.com/css/可以找到各个邮件客户端对css样式的支持情况。
这里还有一篇不错的文章： http://groundwire.org/labs/email-publ...，介绍了一些在email中使用html和css的最佳实践。
Why gmail blocked the css? http://stackoverflow.com/questions/15...

看来只能悲剧的inline了。