laravel 自定义字体在使用 WKHTMLTOPDF 库生成的 PDF 中不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/41295382/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Custom fonts not working in Generated PDF using WKHTMLTOPDF Library
提问by Qazi
I am using Laravel 5.1 SnappyPDF wrapper, which is using WKHTMLTOPDFlibrary. I am trying to include some custom google fonts for my PDF file, but those fonts are not working in generated PDF file.
我正在使用 Laravel 5.1 SnappyPDF 包装器，它正在使用WKHTMLTOPDF库。我正在尝试为我的 PDF 文件包含一些自定义的谷歌字体，但这些字体在生成的 PDF 文件中不起作用。
I tried, converting fonts into Base64and also tried to include fonts by absolute URL and relative URL, also tried many answers available at stack overflow but none of them worked for me. How to fix this issue.
我尝试过，将字体转换为Base64并尝试通过绝对 URL 和相对 URL 包含字体，还尝试了许多在堆栈溢出时可用的答案，但没有一个对我有用。如何解决这个问题。
//Calling fonts
@font-face {
font-family: Roboto Condensed;
src: url("/fonts/RobotoCondensed-Regular/RobotoCondensed-Regular.ttf");
}
@font-face {
font-family: 'Open Sans';src: url("/fonts/OpenSans/OpenSans-Regular.ttf");
}
@font-face {
font-family: 'Open Sans Semi Bold Italic';
src: url("/fonts/OpenSans/OpenSans-SemiboldItalic.ttf");
}
//implenting fonts
.report-page2-col-wrapper .col-heading{
font-family:"Open Sans Semi Bold Italic";
font-size:12pt;
line-height:17pt;
}
see difference in screen shots
查看屏幕截图的差异
1) This is web browser HTML version, looks find and fonts implementing properly
1) 这是网页浏览器的 HTML 版本，看起来查找和字体实现正确
2) This is Generated PDF version, fonts not applying properly
2) 这是生成的 PDF 版本，字体应用不正确
采纳答案by AddWeb Solution Pvt Ltd
There are multiple solutions to accomplish this:
有多种解决方案可以实现这一点：
1)If you use google font, try below:
Use <link>to include google font
1)如果您使用 google 字体，请尝试以下操作：<link>用于包含 google 字体
<link href='http://fonts.googleapis.com/css?family=YOURFONTFAMILY' rel='stylesheet' type='text/css'>
Use <style>to apply font effect
使用<style>应用字体效果
<style type = "text/css">
p { font-family: 'YOURFONTFAMILY'; }
</style>
2)Encode font with Base64 encode tooland use it in css
2）使用Base64编码工具对字体进行编码并在css中使用
@font-face {
font-family: 'YOURFONTFAMILY';
src: url(data:font/truetype;charset=utf-8;base64,AAEAAAATAQA...
}
Hope one of the above is your solution!
希望以上之一是您的解决方案！
Taken ref: use custom fonts with wkhtmltopdf, helvetica font not working in wkhtmltopdf
