Gmail 响应式电子邮件 - 媒体查询 - 样式标签 [英] Gmail Responsive Email - Media Queries - Style Tag

问题描述

请看这里:Gmail 应用(Android)上的响应式电子邮件

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

I'm trying to build a responsive email for use in all email clients. Gmail is stripping my style tags from the head/body and the queries are therefore also stripped.

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

I've tested using Email On Acid and Gmail just displays both versions!

这里的解决方案是什么:

What is the solution here:

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

1) Using a framework? - even these use style/media queries

2) 外部样式表 - 有什么办法可以使这个工作?

2) External stylesheet - is there any way to make this work?

有没有人找到这个问题的永久解决方案.任何建议都会让我非常感激！:)

Has anyone found a permanent solution for this issue. Any advice would me much appreciated! :)

推荐答案

Gmail 要求所有样式都是内联的，它会去除所有媒体查询以及您头脑中真正拥有的任何东西...如果您还没有对此进行编码我建议通过这个http://beaker.mailchimp.com/inline-css 可能会立即解决问题.

Gmail requires that all styles be inline, It will strip out all media queries and really anything that you have in the head... If you have not coded this way i would suggest running your entire email through this http://beaker.mailchimp.com/inline-css Might solve the issue right out.

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

Also worth mentioning if you are not using attribute selectors with your media queries then it is going to look funny in yahoo i usually start responsive emails from here

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

这篇关于Gmail 响应式电子邮件 - 媒体查询 - 样式标签的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！