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

Question

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

此处link的下划线：

<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、hrefs 和文本转换的各种组合来修复此问题，但无济于事。

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

Answer 1

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

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

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

或者添加一个虚拟 url 像 http://www.example.com 会起作用，甚至在测试时添加你最后的 urls。

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

Why is outlook.com moving text underline?

html-email