时间戳

首页 > 解决方案 > 在 Gmail 和 Outlook 中隐藏内容不起作用

html - 在 Gmail 和 Outlook 中隐藏内容不起作用

问题描述

我正在尝试使用两个链接制作一封电子邮件，我只想在 Gmail 中显示一个，第二个在 Outlook 中显示。我做了一些搜索，发现我需要在 Outlook 中使用 mso-hide 并在 Gmail 上显示 none 就足够了。这些都不起作用。display none 在 Outlook 和 Gmail 中隐藏我的元素，mso-hide 没有影响。我的尝试是：

<!--[if !mso 9]><!-->
<div style="mso-hide:all">
  Content 02
</div>
<!--<![endif]-->
<div style='display: none;'>
  Content 03
</div>

是否有解决方案可以仅在 Outlook 上隐藏元素并且与 Gmail 相同？

标签： htmlcssemailoutlookhtml-email

解决方案

Dylan Smith 编写了一个出色的“如何定位电子邮件客户端”页面，其中介绍了针对不同电子邮件客户端的所有已知技术。https://howtotarget.email/

使用它，我们可以得到以下信息：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html lang="en" xml: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" />
  <!--[if !mso]><!-->
  <meta http-equiv="X-UA-Compatible" content="IE=edge" />
  <!--<![endif]-->

<style type="text/css">
u + .body .gmailshow {
    display:block!important;
}    
</style>
    </head>

<body class="body">
    <div>CONTENT EVERYWHERE</div>
<!--[if mso | ie]>
<div>
  Content OUTLOOK only
</div>
<![endif]-->
<div class="gmailshow" style="display: none;">
  Content GMAIL ONLY
</div>

</body>
</html>

笔记：

  • 身体，因为它变成了一个 div，需要一个类（这里，身体）
  • 您的 Outlook if 语句有问题，请务必检查
  • 没有已知的方法可以让 Gmail 定位到 Gmail IMAP，因为它不考虑<style>块（这只是 Gmail 的一个版本 - 标准 Gmail 应用程序和 Gmail 网络邮件使用这种技术）

推荐阅读