有没有一种方法可以在HTML电子邮件中使用Google Web字体？

Question

为了在大多数电子邮件客户端上实现预期的设计，HTML邮件必须（应该）使用内联CSS。

是否有一种方法可以将Google Web字体链接或嵌入此类电子邮件中，但仍保持在电子邮件客户端中的广泛接受度（适当呈现）？

我知道一个替代方案是使用具有对应排版的图像，但我首先想寻找其他可能起作用的东西。

- Gabriel Petrovay

Answer 1

如果字体是必需的，您将不得不采用图像文本解决方案。截至12月份，仅有iOS Mail、Mail.app、Lotus Notes 8、Android上的默认邮件客户端、Outlook 2000和Thunderbird支持使用外部自定义字体。

请参见： http://www.campaignmonitor.com/blog/post/3897/using-web-fonts-in-email

---

编辑于2014年2月10日：由于这是我最受欢迎的答案之一，因此这里提供有关电子邮件中最佳网络字体实践的更新链接：

http://www.campaignmonitor.com/resources/will-it-work/webfonts/

- samanthasquared

Answer 2

现在您可以使用NPM包custom-fonts-in-emails将自定义字体作为图像嵌入到电子邮件中。https://github.com/crocodilejs/custom-fonts-in-emails

import customFonts from 'custom-fonts-in-emails';
import path from 'path';

const options = {
  text: 'Make something people want',
  fontNameOrPath: 'GoudyBookletter1911',
  fontColor: 'white',
  backgroundColor: '#ff6600',
  fontSize: 40
};

customFonts.png2x(options)
  .then(console.log)
  .catch(console.error);

输出：

<img width="461" height="51" src="data:image/png;base64,..." title="Make something people want" alt="Make something people want" style="color: white;font-size: 25.5px;line-height: 51px;text-align: center;background-color: #ff6600;">

渲染:

- user3586413