Android HTML电子邮件移动不使用媒体查询

Android HTML电子邮件移动不使用媒体查询,android,email,outlook,gmail,html-email,Android,Email,Outlook,Gmail,Html Email,正如标题所示,我的媒体质疑被忽略了。我首先要说的是,我知道支持媒体查询的电子邮件客户端很少。但据多个消息来源称,这两种方法都应该支持媒体查询 我试过各种各样的解决办法,但都没有用。甚至这个基本代码也不是从 滴度 @仅介质屏幕和(最大宽度:608px){ .测试{ 显示:无!重要; } } 这应该隐藏起来 这不应该 我知道在html电子邮件中,表格和td比div更受欢迎,但结果是一样的。起初,我通过outlook 2016发送邮件,但我担心它会剥去我的头标签,所以我停了下来。在web浏览器中一

正如标题所示,我的媒体质疑被忽略了。我首先要说的是,我知道支持媒体查询的电子邮件客户端很少。但据多个消息来源称,这两种方法都应该支持媒体查询

我试过各种各样的解决办法,但都没有用。甚至这个基本代码也不是从


滴度
@仅介质屏幕和(最大宽度:608px){
.测试{
显示:无!重要;
}
}
这应该隐藏起来
这不应该
我知道在html电子邮件中,表格和td比div更受欢迎,但结果是一样的。起初,我通过outlook 2016发送邮件,但我担心它会剥去我的头标签,所以我停了下来。在web浏览器中一切正常,但在电子邮件客户端中则不然

编辑:所以我解决了我的问题。这只是电子邮件客户端设置和我如何发送邮件的不幸组合

因此,对于任何迷路的人,请确保:

  • 你不从outlook发送电子邮件,它会去掉标题标签
  • 如果你正在通过gmail应用程序测试你是否使用gmail帐户,否则它不会显示任何样式标签

请确保不要通过Outlook发送电子邮件,因为它在发送时会去除邮件头标签,并且不要通过Gmail应用程序进行测试,如果你可以的话,请发布你正在使用的代码,因为如果没有真实的表示,我们将无法帮助调试。我还应该补充一点,移动电子邮件客户端在过去几年中取得了长足的进步,现在大多数都支持响应式布局。还有一些编码技术可以绕过使用媒体查询几乎迫使不支持的移动电子邮件客户端进行响应性布局,但一旦我们看到您的代码,并且没有其他解决方案,最好研究一下该选项。嘿,谢谢您的回复。我测试的所有代码都在post中。但我发现了问题所在,只是我在不同的时间测试不同的解决方案,而不是一起测试。我已将“解决方案”作为编辑。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html lang="en" xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
        <head>
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
            <meta name="viewport" content="width=device-width, initial-scale=1.0">
            <title>Titel</title>

            <!--[if gte mso 9]><xml>
              <o:OfficeDocumentSettings>
                <o:AllowPNG/>
                <o:PixelsPerInch>96</o:PixelsPerInch>
              </o:OfficeDocumentSettings>
            </xml><![endif]-->

            <style>
                @media only screen and (max-width:608px){
                    .test{
                        display: none !important;
                    }
                }
            </style>
        </head>
        <body style="margin:0;padding:0;min-width:100%;background-color:#ffffff;">

        <div style="display:none;font-size:1px;color:#ffffff;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;"></div>

        <table width="100%" border="0" cellpadding="0" cellspacing="0" style="min-width: 100%;" role="presentation">
            <tr>
                <td align="center">
                    <div class="test">
                        This should be hidden
                    </div>
                    <div>
                        This should not
                    </div>
                </td>
            </tr>
        </table>
    </body>
    </html>