DOMPDF生成的PDF中使用Google Webfonts

Question

DOMPDF生成的PDF中使用Google Webfonts

6

我正在使用两个web字体来制作一个页面，然后使用dompdf将其转换为PDF格式。在头部中我有以下代码:

<link href='http://fonts.googleapis.com/css?family=Signika:600|Roboto+Condensed' rel='stylesheet' type='text/css'>

我随后在CSS规则中使用它们，比如

body {
  font-family: "Roboto Condensed", sans-serif;
  [ ... ]
}
h1 {
  font-family:'Signika', Arial, Helvetica, sans-serif;
  [ ... ]
}

现在，当我生成PDF时，h1标签使用"Signika"字体显示，但是"Roboto Condensed"被Helvetica或其他标准无衬线字体替换。如果我打开预览文件（即我随后包含在PDF生成脚本中的php页面），则"Roboto Condensed"会按预期显示，但它不会出现在PDF中。但正如我所写的，“Signika”在PDF中存在，这对我来说有些奇怪。顺便说一下，我也尝试直接在CSS规则中为p、div、li等包含font-face规则，但这并没有改变任何东西。有什么建议可以解决这个问题吗？编辑/添加：思考一下，两种字体之间的区别在于Roboto Condensed的名称中有一个空格。我想知道这是否会导致问题（即dompdf无法处理这样的字体名称）？但只要我从Google服务器获取字体，我就不能更改它。

- Johannes

只是为了你的“编辑/添加”段落添加这些信息。您可以更改由Google字体获取的字体系列名称。打开字体URL，复制并编辑字体系列到您的CSS中。Roboto Condensed URL包含在您的帖子中：http://fonts.googleapis.com/css?family=Signika:600|Roboto+Condensed - krizajb

2个回答

-1

你不需要真正地做到所有这些。只需使用@import选项将字体嵌入您的HTML中即可。在使用Laravel-dompdf时非常好用。

截图

- daneczech

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Johannes · Accepted Answer

我自己找到了解决方案：

正如我在编辑中添加到我的问题中的那样，显然原因是字体名称“Roboto Condensed”包含一个空格，dompdf似乎不喜欢。

我下载了这个字体，并使用Fontsquirrel上的字体生成器创建了三个版本，并将它们和这个样式表一起放在了我的服务器上：

@font-face {
    font-family: 'roboto_condensedregular';
    src: url('robotocondensed-regular-webfont.woff2') format('woff2'),
         url('robotocondensed-regular-webfont.woff') format('woff'),
         url('RobotoCondensed-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
}

然后，在我的CSS规则中，我使用了新的字体名称roboto_condensedregular，在font-family: roboto_condensedregular, sans-serif;中。

现在它可以在PDF中正常工作。