不会隐藏 Outlook 电子邮件中的内容答案

【问题标题】：Won't hide content in outlook email不会隐藏 Outlook 电子邮件中的内容
【发布时间】：2019-10-02 08:23:06
【问题描述】：

我正在尝试制作一个适用于 Outlook 的响应式电子邮件模板。 Outlook HTML 工作正常，响应式 HTML 也工作正常。

我在响应部分使用了媒体查询，但现在每当向 Outlook 发送电子邮件时，内容都会重复。

我的 HTML 设置如下：

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
    <meta name="viewport" content="width=device-width initial-scale=1">
    <style> //Media Queries are here </style>
  </head>
<body>
    <!--[if gte mso 12]>
     //All of the Outlook HTML is held here
    <![endif]--> 

    <!--[if gte mso 12]>
      <div style="width:0px; height:0px; overflow:hidden; display:none; 
      visibility:hidden; mso-hide:all;">
    <![endif]-->

   //All of the none Outlook HTML is held here

   <!--[if gte mso 12]></div><![endif]-->
</body>
</html>

我想要发生的是，只要将电子邮件发送到 Outlook，并且如果其他客户端使用 HTML 的其他部分，顶部部分就会运行。

我知道这不是最好的方法，因为实际上我应该只显示和隐藏部分代码而不是整个代码，但这更容易组合在一起。

有趣的是，这只是在我开始使用媒体查询而不是为所有分辨率声明相同的 VW 时才开始发生的。

任何帮助将不胜感激。

【问题讨论】：

我尝试将底部的 div 更改为表格，认为这是由于 Outlook 忽略了 div。所有这一切都是使重复的 HTML 向左对齐，所以它看到了

标签： html html-email

【解决方案1】：

所以我对这个问题的解决方案是将style="mso-hide:all" 添加到第二个块中的每个标签上。

【讨论】：

有 if mso 和 if not mso 的代码。你试过那些吗？这是一种更简单的方法。
我已经尝试过这些代码，它最初确实可以工作，但是一旦我开始使用媒体查询，它就因为某种原因停止工作了。
媒体查询无论如何都不会破坏它，相信我
我终于有时间再做这个项目了——利用评论代码

【解决方案2】：

在要为 Outlook 隐藏的部分中使用 mso-hide:all，这会使该部分对 Outlook 特定客户端隐藏。

【讨论】：