css - Gmail 响应式电子邮件 - 媒体查询 - 样式标签

标签 css responsive-design gmail media-queries html-email

See here: Responsive emails on Gmail app (Android)

我正在尝试构建一个用于所有电子邮件客户端的响应式电子邮件。 Gmail 正在从头部/正文中剥离我的样式标签,因此查询也被剥离。

我已经使用 Email On Acid 进行了测试,Gmail 只显示两个版本!

这里的解决方案是什么:

1) 使用框架? - 即使这些使用样式/媒体查询

2) 外部样式表 - 有什么方法可以让它工作吗?

有没有人找到这个问题的永久解决方案。任何建议,我将不胜感激! :)

最佳答案

Gmail 要求所有样式都是内联的,它将去除所有媒体查询以及您头脑中的任何内容...如果您没有以这种方式编码,我建议您通过此 http://beaker.mailchimp.com/inline-css 运行您的整个电子邮件可能会立即解决问题。

另外值得一提的是,如果您没有在媒体查询中使用属性选择器,那么它在雅虎中看起来会很有趣,我通常从这里开始响应式电子邮件

http://webdesign.tutsplus.com/articles/creating-a-simple-responsive-html-email--webdesign-12978

关于css - Gmail 响应式电子邮件 - 媒体查询 - 样式标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22073083/

相关文章:

html - 在 div 上应用悬停效果,但不在 h2 上应用

html - 使用 CSS3 的响应式设计

html - 响应式地将 50% 的圆圈对齐到矩形的底部中心?

gmail - POP3、IMAP 和 Exchange 之间有什么区别?

php - 来自网站的邮件,在 Gmail 中进行两步验证

html - 创建一个 css 功能区 - 可以在页眉中创建,在页脚中复制不起作用

html - 首次加载 html 页面时默认打开导航栏

html - 我可以让 Bootstrap 列在较小的屏幕上两两排到下一行吗?

css - 有趣的 CSS 响应宽度问题

python - 使用 Python 检查未读的 Gmail 邮件数