黑莓电子邮件响应式查询

Question

我正在 MailChimp 中创建一个电子邮件模板，并且我有一些响应式代码，我想在支持它的设备（主要是 iOS Mail 和 BlackBerry Mail 应用程序）上工作。

虽然模板在 iOS 邮件应用程序中正确加载响应式媒体查询，但它们似乎不会在 BlackBerry 邮件应用程序中触发。我正在使用相同最新操作系统的 BlackBerry Z10 和 Q10 上进行测试。

我的媒体查询如下所示：

@media only screen and (max-device-width: 600px) {
        #templateContainer {
            width: 100% !important;
        }       
        .globalLogo {
            width: 90% !important;
        }
        .logoBox {
            display: block !important;
            width: 100% !important;
        }
        .imageBox {
            width: 100% !important;
            display: block !important;
            height: 40px !important;
            border-left: none !important;
        }
        .emailTitle {
            text-align: center !important;
        }
        #title {
            border-top: 3px solid #FFF !important;
            width: 100% !important;
            display: table !important;
        }
        .topImageRow {
            display: none !important;
        }
        .tableofcontents {
            margin:0 0 30px 0 !important;
            list-style: outside !important;
            width: 90% !important;
        }
  }

我还在标题中添加了以下视口元标记：

<meta name="viewport" content="width=device-width; initial-scale=1, maximum-scale=1">

我尝试过使用 max-width 而不是 max-device-width，但它似乎并没有什么不同。我也试过 800px 而不是 600px，并从媒体查询中删除“唯一的屏幕和”。

任何帮助将不胜感激。

Answer 1

最终答案：

将其发送到不同的电子邮件帐户域。有时它可能是您工作场所的安全过滤器，因此如果您将其发送到 you@yourwork.com，请尝试将 you@yourotheremail.com 连接到您的黑莓并在那里进行检查。

---

原文：

并不是一个真正的明确答案，但希望这会让你更接近......

创建一个非常简单的媒体查询来触发（例如 max-width:99999px;）并更改颜色或一些非常明显的东西。它真的有效吗？

如果它正在触发，请向下走直到它停止。如果你不能让它在 99999px 触发，它不支持媒体查询，尽管the support charts 建议它支持。

有时您的服务器可以剥离媒体查询，因此请尝试在不同的域上进行测试，特别是如果您有任何类型的公司服务器或软件。

您可以做的另一件事是尝试查看输出代码，看看您的 CSS 是否仍然完好无损。不知道如何在黑莓上查看这个。