gmail忽略响应式CSS媒体查询

Question

我正在使用 Gmail 和 chrome 开发工具（响应式，382x661）并且我的电子邮件模板 CSS 被忽略。

在我的标题中：

 <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />

我的 CSS：

@media screen and (max-device-width:500px), screen and (max-width:500px) {
/* css */
}

我的响应式 CSS 被忽略，电子邮件模板以桌面模式显示。

我该如何解决？

Answer 1

根据您的居住地和 您在哪个 Gmail 客户端中查看此电子邮件，media-queries 可能仍不受支持。

2016 年底，美国的 Gmail 帐户开始支持媒体查询，而英国的帐户则没有。此后，英国获得了媒体查询支持，但可能尚未覆盖世界所有其他地区。

Gmail也基于 Gmail 产品推出。以下是对现在推出的位置的快速细分：

More info and updated charts on Litmus

---

无论您身在何处，每个 Gmail 客户端都不支持媒体查询。