html - 在 Microsoft Outlook 中打印时隐藏 HTML 元素

Question

我想在打印时在我的 HTML 格式的消息中隐藏一个表格。它有一个 class="noprint" 属性。其他彬彬有礼的邮件客户端尊重 CSS 规则和媒体查询，我需要做的就是添加一个基本样式表：

@media print {
     .noprint { display: none; }
}

我从这篇文章中看到 Outlook 和 Word 不支持媒体查询。

有谁知道解决方法？

Answer 1

有一个有条件的 css 解决方法。将此代码添加到您的主 css 文件中。

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

希望这可以帮助。

Answer 2

mso-hide:all单靠自己是行不通的。它是 Microsoft Word 引擎的供应商特定属性。为了在桌面上隐藏/在移动设备上显示，您需要额外的属性。以下是您需要使用的一些附加属性：

*[class="hide"] {
    max-height:0; /* Gmail*/
    display:none; /* Generic*/
    mso-hide:all; /* Outlook clients*/
    overflow:hidden; /* Generic */
    font-size:0; /* Be careful with this one, only use if absolutely required */
} 

然后在媒体查询中，您希望覆盖设置为与隐藏相反的任何值。

另请注意mso-hide:all，如果您尝试隐藏包含嵌套表格的表格单元格中的内容，则必须将此属性也应用于其中的任何和所有嵌套表格。