Question

我很好奇，是否有任何好的资源来检查浏览器，电子邮件客户端和移动操作系统之间的兼容性？大多数CSS选择器都可以用于响应式电子邮件吗？

Answer 1

当谈到电子邮件爆炸时，我总是接近这个任务，就像90年代后期一样。您通常会避开这些日子的实践，最有可能跨大多数电子邮件客户端工作。

我正在谈论表格，内联CSS，尽管你可以做到这一点。

话虽如此，我用来测试输出的工具是http://litmus.com，它会在各种操作系统和设备的各种电子邮件客户端上准确显示您的HTML。

正如其他人已经指出的那样，http://www.campaignmonitor.com/css/是一个很好的资源，可以看到哪些有效，哪些无效。

Answer 2

您无法在电子邮件中使用CSS文件。大多数电子邮件客户端（如Gmail）都会将其删除，如果没有它，您的内容可能会非常奇怪。

如果您想在电子邮件中使用样式，这是比较不同客户端的简便方法：

http://www.campaignmonitor.com/css/

Answer 3

@APAD1说：

当谈到电子邮件爆炸时，我总是接近这个任务，就像90年代后期一样。您通常会避开这些日子的实践，最有可能跨大多数电子邮件客户端工作。

可悲的是，是的。

在您进行内联舞蹈时帮助您保持理智的工具是MailChimp's CSS Inliner。粘贴普通代码，得到可怕的代码。

您还可以使用PHP之类的东西来创建电子邮件模板，然后通过变量回显样式。

$title = "color: white; font-weight: normal;";
$header = "background-color: blue;";

<td style="<? echo $header; ?>">
    <h2 style="<? echo $title; ?>"> My Header </h2>
</td>

如果您的应用向用户发送自动发送的消息，这种方式效果特别好，因为它仍然为您提供了将所有样式保存在一个位置的好处。我创建了一个CakePHP帮助器，因此我可以在多个不同的系统电子邮件模板中重用这些样式。

最后，与普通的HTML / CSS开发相比，虽然有点丑陋且仍然很痛苦，但与向元素添加类名没有什么不同。实际上，内联样式是您可以对交叉电子邮件客户端工作的唯一信心。

响应式电子邮件：适用的CSS选择器和属性的完整列表

3 个答案: