iOS 10 邮件客户端不接收媒体查询答案

【问题标题】：Media queries aren't picked up by iOS 10 mail clientiOS 10 邮件客户端不接收媒体查询
【发布时间】：2017-03-02 22:42:00
【问题描述】：

当前硬件配置：iPhone 6s、iOS 10.0.1（我有一个针对 iOS 10.0.2 的软件更新待定）

我有以下 html 测试代码（p.s. 我还测试了 iPhone 6s 特定的查询，如answer 中指定的）

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <style>
        @media (max-width: 600px) { h1.query1 { color: red !important; } }

        @media (max-width: 700px) { h1.query2 { color: purple !important; } }

        @media (min-width: 300px) { h1.query3 { color: blue !important; } }

        @media (min-width: 320px) { h1.query4 { color: white !important; } }

        @media (max-device-width: 1125px) { h1.query5 { color: yellow !important; } }

        @media (max-device-width: 1242px) { h1.query6 { color: violet !important; } }
    </style>
</head>

<body style="margin: 0 0 0 0; padding:0; min-width: 100%; width: 100%; offset: 0; clear: both;">
    <div style=" margin: 0; min-width: 100%; padding: 0; width: 100%;">
        <h1 class="query1" style="color: green;">MEDIA TEST</h1>
        <h1 class="query2" style="color: green;">MEDIA TEST</h1>
        <h1 class="query3" style="color: green;">MEDIA TEST</h1>
        <h1 class="query4" style="color: green;">MEDIA TEST</h1>
        <h1 class="query5" style="color: green;">MEDIA TEST</h1>
        <h1 class="query6" style="color: green;">MEDIA TEST</h1>
    </div>
</body>

</html>

现场版在这里：http://codepen.io/anon/pen/gwkbEK

当我将它发送到我在 Android 手机上的 Gmaill 应用程序中的帐户时，我得到以下结果（所有行都是彩色的）：

但是当我在 iPhone 6 的原生 iOS 10 邮件应用程序中打开相同的邮件时，我得到了这个结果（所有标签都是绿色的）：

是我做错了什么，还是 iOS 10 邮件客户端停止支持媒体查询？

【问题讨论】：

标签： ios iphone email html-email ios10

【解决方案1】：

重要提示：这些屏幕截图是 iOS 上的 Gmail 应用程序，而不是 iOS 邮件应用程序。直到几周前，还没有任何移动 Gmail 客户端支持媒体查询。 Gmail 最近开始推出基于平台、地理位置和产品的媒体查询支持。在推出完成之前，Google Mail 产品的结果会有所不同。

截至 2016 年 10 月，美国的 Gmail 帐户开始支持媒体查询，而英国的帐户则不支持。 Litmus 预览版使用英国 Gmail 帐户，因此无论我们从何处进行测试，我们都不会在 Litmus 中看到更新。

Gmail 也基于 Gmail 产品推出，因此根据您检查的 Gmail 产品的类型和平台，结果可能会有所不同。以下是对现在推出的位置的快速细分：

More info and updated charts on Litmus

【讨论】：

非常感谢！可能我应该向某人借用 iPhone 来更好地了解 UI...