为什么outlook.com 移动文本下划线？

Question

在我的 html 电子邮件中，我有两个带下划线的白色链接，除了 Outlook.com/Office 365 之外，这在任何地方都有效。在这些网站上，链接没有下划线，但其他一些不相关的非链接文本是？！

链接中的下划线：

<table width="100%" border="0" cellspacing="0" cellpadding="15" bgcolor="#001342">
    <tr>
        <td width="100%" align="center" valign="middle" style="font-family: Arial, Helvetica, sans-serif; font-size: 18px; line-height: 24px; color: #ffffff;">
            <p>Register onto <span style="color: #ffb718;">X</span> by completing the short form <a href="#" style="color: #ffffff; text-decoration: underline!important;">here</a></p>

        </td>
    </tr>
</table>

Appears to be getting applied here instead:

<tr>
    <td width="50" align="left" valign="middle">
        <img src="images/icon-clipboard.gif" alt="" width="40" height="40" border="0">
    </td>
    <td class="list-text" align="left" valign="middle" style="font-family: Arial, Helvetica, sans-serif; font-size: 26px; line-height: 30px; color: #001342;">
        <p style="text-decoration: none!important;"><span style="color: #ffb718; font-weight: bold;">1.</span> REAL-TIME AVAILABILITY</p>
    </td>
</tr>

您可以在此处的屏幕截图中看到问题http://kinocreative.uk/img/

我尝试了各种 span、href 和 text-transform 的组合来解决这个问题，但无济于事。

完整的电子邮件代码在这里：https://pastebin.com/PfNmTeZc

Answer 1

Outlook.com 和 Office 365 不喜欢虚拟链接。如果您包含它们，您会发现一些小的不一致，例如您看到的基于 html 的按钮背景色的背景会扩散到按钮下方的内容。

这是一个简单（但烦人）的问题，只需简单修复即可。我使用的一种技术是在 # 之后添加句号，如下所示：

<a href="#." ...></a>

添加一个像http://www.example.com 这样的虚拟网址也可以，甚至在测试时添加您的最终网址。