如何防止移动电子邮件客户端上的智能突出显示？（外表）答案

【问题标题】：How to prevent smart highlighting on mobile email clients? (Outlook)如何防止移动电子邮件客户端上的智能突出显示？（外表）
【发布时间】：2022-01-02 08:38:54
【问题描述】：

我已向 Outlook 发送了一封测试电子邮件，并在 iOS 的 Outlook 应用程序中打开，日期/时间文本的默认样式有自己的颜色。 p>

（白色/灰色部分只是为了隐藏文本，你可以看到绿色的下划线文本（这是一个日期）

应用程序不允许调试，因此很难说它可能已应用于显示的 HTML 的哪个类。

如何防止这种行为并让文本在 CSS 中定义颜色？

注意：这是通过 MJML 生成的 HTML。该段落的转译 HTML 如下所示：

<tr>
    <td align="center" style="font-size:0px; word-break:break-word">
        <div style="font-family:helvetica; font-size:10px;">
            TEXT WITH DATE
        </div>
    </td>
</tr>

text-decoration: none 用于删除下划线样式，但颜色不会改变 (color: white) - 有或没有!important

【问题讨论】：

text-decoration-none 或 text-decoration: none;?
@fxtrot 好点。我修正了问题中的错字（我检查了代码，已经是:none）
但还有另一个导致解析问题的错字。 text-decoration: none 有效，但颜色没有改变 (color: white)

标签： css outlook html-email mjml

【解决方案1】：

避免在 iPhone 上自动链接日期/时间的解决方案：

添加：

&#8203;（零宽度空格字符）在日期/时间文本部分之间
nbsp;（不间断空格）之间的空格

例子：

日期（使用智能链接/突出显示）：11 月 1 日 10:15
非链接日期（没有智能链接/突出显示）：&#8203;November&#8203;,&nbsp;&#8203;1st&nbsp;10&#8203;:&#8203;15

【讨论】：

【解决方案2】：

某些设备会自动链接日期和地址，因为它允许用户一键添加到他们的日历或地图应用程序中。

要解决此问题，您可以使用内联样式包装该副本，以便当这些设备链接该副本时，它具有预设样式。智能手机会自动添加 href 部分。

例子：

<a style="color:#FFFFFF;text-decoration:none;">
 November 13, 2021
</a>

【讨论】：