电子邮件中的媒体查询[Gmail]？

Question

我只是想在我的朋友/家人周围发送一个小小的圣诞节电子邮件,我已经建立了它以完全响应等我一如既往的方式.然而,因为它只是为朋友,我不会通过MailChimp发送它通常发送一切对我来说没有问题.

我尝试发送它的方法是打开index.html文件,选择全部,复制,然后粘贴到Gmail.这对我来说一直很好,并且确实有效.然而,这是我尝试以这种方式发送的第一封响应式电子邮件,而且似乎媒体查询不会被这种方式带来,至少在我刚刚做过的gmail - > hotmail测试中没有(调整窗口等等)什么都不做,只显示桌面版本).

是否有更好的方式来发送已构建的HTML电子邮件,而不仅仅是在Gmail中复制/粘贴？

Answer 1

很遗憾,Gmail不支持该<style>标记.媒体查询只能在<style>代码中调用,而不能内联,因此Gmail不支持它们.

这是支持图表.

我建议你坚持使用像Mailchimp这样的ESP来发送HTML电子邮件.但是,当您在Gmail中玩游戏时,这里有一个工具可以帮助您调试电子邮件代码的问题.

Answer 2

所选答案实际上并不正确!Gmail会从电子邮件正文中删除ID和类,但会保留样式标记.

您可以使用以下内容:

*[summary~='fakeclassname'] {
    styles: here;
}

"摘要"是Gmail并属性之一不剥离出.在我发现Gmail实际上对电子邮件做了什​​么之后我发现这篇文章详细介绍了它:

http://freshinbox.com/blog/interactive-emails-in-gmail-using-css-attribute-selectors/

该页面上有一些有用的链接可以深入了解特定于Gmail的定位.

注意:Gmail 应用程序会删除样式标记,并且市场份额不断上升(Android不再拥有原生应用并推动人们使用Gmail应用)应该被视为移动优先电子邮件开发的起点.