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

标签 html css twitter-bootstrap email

我在电子邮件的标题中这样调用 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)

最佳答案

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

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

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

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

关于html - Bootstrap 3 : Emails defaulting to print media type even on screen,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22618273/

相关文章:

css - 图标 fa-twitter : What does this mean?

html - 固定标题定位问题

css - 如何使 JPG 仅在悬停时加载?

html - 如何强制肖像图像与风景图像具有相同的大小并具有响应性?

html - 响应式背景图片 - 使用 Ruby on Rails Bootstrap jumbotron

html - 全高侧边栏和带有粘性页脚布局的内容

JavaScript onclick 方法,将其附加到所有按钮

php - 从历史记录中隐藏页面

javascript - 使用jquery和css隐藏菜单栏div下方的容器div

html - Bootstrap 导航栏固定顶部