【问题标题】:Web font in email not displaying电子邮件中的 Web 字体未显示
【发布时间】:2021-05-22 07:30:57
【问题描述】:

我使用nodemailer 来处理我的电子邮件。我正在尝试将 Poppins 作为我的 html 正文中的文本的字体。目前我有以下代码:

    <head>
          <meta charset="utf-8">
          <link href="https://fonts.googleapis.com/css2?family=Poppins&display=swap" rel="stylesheet">

          <style>
                 .text {
                      font-family: 'Poppins';
                  }
          </style>
   </head>


   <body>
        <p class="text">
             This is a paragraph
        </p>
   </body>

但是字体不应用于段落。当我将此 html 粘贴到 Web 浏览器(控制台工具)中时,该段落已应用字体。我的猜测是电子邮件不能嵌入网络字体,但很多文章都说有可能像thisthisthis。我尝试过使用

@media screen {
   @font-face {
   }
}

甚至是其他字体,如第一篇文章中的 Montserrat。

我已经在 Outlook 和 gmail 上进行了测试,但都无法正常工作。 Outlook 版本是 Outlook 2016 (16.0.9126.2259)。 我在哪里/哪里出错了?

【问题讨论】:

    标签: css email fonts nodemailer


    【解决方案1】:

    很遗憾,Gmail 不太支持网络字体。

    Gmail 官方只支持两种网络字体:Open Sans 和 Roboto。不要指望任何其他网络字体都能在 Gmail 中正确呈现。但是,有许多电子邮件客户端支持 Microsoft、Apple 等网络字体。但是,由于 Gmail 被许多人广泛使用,您不会希望使用网络字体,因为它们的支持不普遍。

    https://www.smartrmail.com/blog/email-safe-fonts-web-safe-fonts-for-email-explained

    【讨论】:

    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-07-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2011-10-17
    • 1970-01-01
    相关资源
    最近更新 更多