html - Bootstrap 3 : Emails defaulting to print media type even on screen

Question

我在电子邮件的标题中这样调用 bootstrap 3 的样式表:

<link href="/assets/bootstrap.css" media="screen" rel="stylesheet" type="text/css" />

我注意到我的电子邮件中的链接显示为黑色且没有任何装饰，并确定它们使用的是仅在 bootstrap 3 的@media 打印部分中的 css，特别是 color: #000 !important;。

这是为什么呢？

如何指定我的电子邮件应该是屏幕媒体类型而不是打印？ (当然除非有人决定打印它)

(编辑:我应该指定我正在使用 Roadie gem 将样式转换为内联电子邮件:https://github.com/Mange/roadie)

Answer 1

您不能在 html 电子邮件中链接到外部样式表。您需要将其包含在正文中。即使那样为了 100% 的兼容性，它也必须内联，因为 Gmail 去除了 <style>一起标记。

此外，bootstrap 不是为电子邮件设计的，因此它不会在大多数电子邮件客户端中一致地呈现。您需要改用表格。

如果你想要一个电子邮件框架，试试 Zurb 的 Ink .

虽然被认为是“模式”，但我也推荐 Cerberus通过泰德戈斯或 Responsive Email Patterns布莱恩·格雷夫斯。