html - Outlook 2016/2019 不显示边框底部

Question

我有一个电子邮件模板，除了一个元素外，所有内容都在工作，但在 Outlook 中无法正确呈现。这是代码:

<a href="https://website.com/link" style="color: #fff; display: inline-block; font-weight: bold; text-decoration: none; border-bottom: solid 2px #e30517; padding-bottom: 3px; padding-left: 3px; padding-right: 3px;">View Event</a>

其他浏览器向我显示:

Outlook 2016 和 2019 看起来像这样(请注意链接上缺少的底部边框):

是否有任何提示/技巧可以让 2px 底部边框显示在那些电子邮件客户端上？

Answer 1

尝试添加这个:

mso-border-alt: 2px solid #e30517;

它是特定于 Outlook 的，将被其他电子邮件客户端忽略。它将在“查看事件”周围创建一个框，但至少它给了你重点。

mso-border-bottom-alt: 2px solid #e30517; 将仅在 Outlook 2019 中创建下划线。

更好的解决方法是创建一个包含一列和两行的表格。第一行将包含“View Event”，第二行将是 2px 高并带有背景色。这是所有电子邮件客户端中最一致的修复方法。

祝你好运。