使用 MSO 9 条件隐藏 Outlook 的移动内容答案

【问题标题】：Hiding Mobile Content for Outlook using MSO 9 condition使用 MSO 9 条件隐藏 Outlook 的移动内容
【发布时间】：2017-05-24 18:06:26
【问题描述】：

我正在构建一个电子邮件模板，并且遇到了我想在桌面上隐藏“td”的情况。除了 Outlook 2007/10/13/16 之外，我几乎可以使用所有电子邮件客户端的媒体查询和“显示”：无“属性来实现它。

我的“td”看起来像这样。

                        <td style="display:none;" class="show" >
                <table border="0"cellpadding="0"cellspacing="0"width="100%">
                    <tr>
                        <td style="usual styling">
                            <font>some text</font>
                        </td>                  
                    </tr>
                    </table>
                    </td>

并且显示类很简单：

            /* Responsive */ 
        @media only screen and (max-width: 450px) {
            .show {display:inline !important;}
            }

我在不同的论坛上读到，如果使用 mso 9，您可以将部分 HTML 隐藏在 Outlook 中。所以我尝试了类似的方法：

 <!--[if !mso 9]><\!-->
<td style="display:none;" class="show" >
    <table border="0"cellpadding="0"cellspacing="0"width="100%">
        <tr>
            <td style="usual styling">
            <font>some text</font>
            </td>                  
        </tr>
    </table>
</td>
<!-- <![endif]-->

但 Outlook 2007/10/13/16 仍会显示此内容和其中的内容。有人可以帮我弄清楚这是如何实现的吗？

【问题讨论】：

标签： html email outlook

【解决方案1】：

试试这个：

<!--[if (gte mso 9)|(IE)]>
<td style="display:none;" class="show" >
  <table border="0"cellpadding="0"cellspacing="0"width="100%">
    <tr>
      <td style="usual styling">
        <font>some texty</font>
      </td>                  
    </tr>
  </table>
</td>
<![endif]-->

这里有一些其他信息可以帮助您使用 Outlook。

Microsoft Outlook 会忽略 @media 查询。

在您的代码中，您有一个名为.show 的类。如果您想从 Outlook 中隐藏一个类，请创建一个样式表，将其放在您的另一个 <style> 表下方的 <head> 中。这应该使它正常运行。

<!--[if (gte mso 9)|(IE)]>
  <style type="text/css">
    .show {display:none;}
  </style>
<![endif]-->

祝你好运。

【讨论】：