node.js - Windows 10 邮件渐变不显示

Question

我发现 Windows 10 中可用的 Mail 应用程序存在问题，特别是，我在 NodeJS 中开发了一个小应用程序，该应用程序使用 nodemail 包发送电子邮件，该电子邮件的标题中具有以下布局:

<div id="header" style="background: linear-gradient(to right,#00c7ce,#1a5cce 85%); border-bottom: 4px solid #1a5cce;
                height: 45px; padding: 10px 15px;">
    <strong id="logo" style="color: white; font-size: 20px;
            text-shadow: 1px 1px 1px #8F8888; margin-top: 10px; display: inline-block">
        <%= process.env.COMPANY_NAME %></strong>
</div>

电子邮件在GMAIL中完美显示:

但在 Windows 10 Mail 中，渐变未呈现:

这是 Windows 10 Mail 应用程序的错误吗？因为在其他电子邮件软件中我没有遇到任何问题。

Answer 1

这本身并不是 Windows 10 邮件应用程序中的错误。这是因为 Gmail 和 Windows 10 Mail 使用不同的渲染引擎。考虑不同的 Web 浏览器如何以不同的方式应用 CSS 规则。电子邮件客户端也是如此，只不过 web standards set forth by W3C通常会被电子邮件客户端完全忽略，或者他们可能选择只遵守标准的一个非常小的子集。

尝试在电子邮件客户端中使用现代 CSS 功能将会产生广泛的效果，如果不在许多不同的环境中测试生成的电子邮件，这些效果并不总是可预测的。

通过使用背景图像而不是 CSS 渐变，您也许能够在屏幕截图中获得所需的渐变效果，但这可能会导致其自身的一系列问题(例如特定电子邮件客户端是否会渲染它，是否文本正确地呈现在其顶部，等等)。

以下是一些链接，您可以在其中了解有关这个复杂问题的更多信息:

• Coding for Windows 10 Mail App (emailonacid.com)
• Why Clients Render Email Differently (MailChimp)