Heroku上的字体使用wicked_pdfwkhtmltopdf

Heroku上的字体使用wicked_pdfwkhtmltopdf,第1张

概述我正在使用wicked_pdf从 HTML生成PDF并部署到Heroku. 这部分工作正常,我使用@ font-face对不同的字体进行了实验,但到目前为止,当我使用“serif”作为字体时,会产生最好的结果. 我的假设是wkhtmltopdf在Heroku服务器上使用内置字体来呈现“serif”.虽然这在PDF上看起来不错,但各种 *** 作系统上的浏览器为“serif”呈现不同的字体 – 所以我想尝试 我正在使用wicked_pdf从 HTML生成pdf并部署到Heroku.

这部分工作正常,我使用@ Font-face对不同的字体进行了实验,但到目前为止,当我使用“serif”作为字体时,会产生最好的结果.

我的假设是wkHTMLtopdf在Heroku服务器上使用内置字体来呈现“serif”.虽然这在pdf上看起来不错,但各种 *** 作系统上的浏览器为“serif”呈现不同的字体 – 所以我想尝试找到HTML的匹配字体.

是否有可能找出Heroku服务器上安装的字体以及哪个字体映射到“serif”?

解决方法 您可以通过CSS显式设置所需的字体,以在不同的系统和浏览器中获得一致的字体呈现.我有两种方法可以做到这一点:

一种是指定CSS字体样式,默认后备字体为serif.例如,要从Google字体添加DroID serif字体,并将其用作主体字体样式:

<link href='http://Fonts.GoogleAPIs.com/CSS?family=DroID+serif' rel='stylesheet' type='text/CSS'><style>    body {        Font-family: 'DroID serif',serif;    }</style>

DroID serif将出现在所有现代浏览器中,默认为Heroku上的serif,以及具有旧/更简单Web浏览器的设备.缺点是字体在浏览器中看起来是单向的,但在pdf中是不同的,因为Heroku将使用其默认的serif字体.

第二种方法是对字体进行Base64编码(you can use this tool),并将其包含在CSS中:

@Font-face {    Font-family: 'OpenSans';    src: url(data:Font/truetype;charset=utf-8;base64,AAEAAAATAQA...}

这也可以在所有现代浏览器中使用,还可以使用Heroku为您提供一致的字体渲染.这种方法特别方便,因为您不仅可以在浏览器中获得一致性,还可以在您的开发环境和Heroku中获得一致性,因为您不必使用git-push字体并且在CSS中使用本地/绝对路径.

总结

以上是内存溢出为你收集整理的Heroku上的字体使用wicked_pdf / wkhtmltopdf全部内容,希望文章能够帮你解决Heroku上的字体使用wicked_pdf / wkhtmltopdf所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错,欢迎将内存溢出网站推荐给程序员好友。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1060263.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-05-25
下一篇 2022-05-25

发表评论

登录后才能评论

评论列表(0条)

保存