使用 Chrome 打印到 PDF 时嵌入 @font-face 字体答案

【问题标题】：Embed @font-face fonts when Printing to PDF with Chrome使用 Chrome 打印到 PDF 时嵌入 @font-face 字体
【发布时间】：2012-07-21 05:28:30
【问题描述】：

我有一个页面，我只在 Chrome 中使用一堆自定义字体呈现：

@font-face{ font-family: BodyFont; src: url('fonts/font.ttf'); }

浏览器完美呈现一切。但是，当我尝试将其打印为 PDF 时，有两个问题：

Chrome 的打印预览有时不会以某些字体显示文本，或者会损坏文本。这个视图会传递给我使用的任何打印设备。关闭/重新打开选项卡不会更改预览。但是，重新启动浏览器会。
无论我做什么，我都无法生成嵌入字体的 PDF。我尝试过 Chrome 的“保存到 PDF”，它会生成 Adobe Acrobat 无法打开的 PDF。各种 PDF 打印机（例如 Adobe 的）无法生成嵌入这些字体的 PDF，即使将 @font-faces 替换为标准 Web 字体确实会生成嵌入字体。

感谢您对任一问题的任何帮助。

【问题讨论】：

对于任何搜索的人，这似乎已在以后的 Chromium 版本中得到修复。使用 Chromium 69，带有 TTF src 的字体会正确嵌入到生成的 PDF 中。

【解决方案1】：

在 CSS 或 HTML 中注释掉媒体查询，重新打开浏览器，它会在打印预览中加载网络字体，然后，重新添加媒体查询部分，它就可以工作了。

【讨论】：

【解决方案2】：

尝试在打印时加载默认字体。将以下行添加到您的 CSS 并尝试。

@media print {
 body {
      font-family: Arial, Helvetica, sans-serif;       
  }
}

【讨论】：