wkhtmltopdf 的字母间距太大

Question

我正在使用 wkhtmltopdf 将网页下载为 pdf。

但是 css 属性字母间距似乎不起作用

font-size:20px; letter-spacing:0px;

font-size:20px; letter-spacing:1px;

间距很大1px...

我尝试了 2 种不同的字体系列

Answer 1

这是一个已知问题。 https://github.com/wkhtmltopdf/wkhtmltopdf/issues/1575。没有解决办法。只是为了避免使用字母间距

Answer 2

letter-spacing 在 wkhtmltopdf 中被破坏了。
但我发现了其他的字距调整方法：

1.您可以为每个字母设置位置。字距用于标题，所以通常没有那么多字母。

2. 您可以更改字体文件并设置您想要的自定义字距。通常改变拉丁字母就足够了。我已经对此进行了测试并且效果很好。为此使用了 FontForge (http://fontforge.github.io/)。不过可能有更方便的软件吧

Answer 3

我遇到了同样的问题，我将 dpi 设置为 96（在 wkhtmltopdf 选项中）并且工作正常，但不确定为什么。

Answer 4

每张脸都有字母间距问题，完美解决方案在这里。

import pdfkit
#SnippetBucket.com code for pdfkit
path_wkthmltopdf = r'/var/www/aukcnydom/wkhtmltox/bin/wkhtmltopdf'
config = pdfkit.configuration(wkhtmltopdf=path_wkthmltopdf)
#more better and more accurate code for DPI set
config.default_options = {
        'page_size': 'A4',
        'print_media_type': True,
        'dpi': 96
    }
pdfkit.from_string(mark_safe(unicode(self.document)),settings.MEDIA_ROOT +"/"+ path, options=options, css=style,  configuration=config)

比 css。添加您的字母间距。

p{letter-spacing: 0.4mm !important; text-align: justify ; font-kerning: normal; text-rendering: optimize-speed;}
/* SNIPPETBUCKET.COM, CSS CODE WITH LETTER SPACING */

这种方式简单地解决了您的问题并完美地工作了字母间距。

注意：我已经提供了示例，您可以对您的代码应用适用的更改。

Answer 5

我遇到了同样的问题，我已经通过

解决了

sudo wget http://pastebin.com/raw.php?i=AmfYN3er -O /etc/fonts/conf.d/10-wkhtmltopdf.conf

http://www.jeremydaly.com/how-to-install-wkhtmltopdf-on-amazon-linux/

Answer 6

我们遇到了同样的问题。一种解决方法是将 dpi 标志设置为 96.

由于将 DPI 设置为如此低的值（打印通常至少使用 300）会导致图像模糊，我们尝试使用 SVG 字体文件，这成功了。

Answer 7

在 Windows 上使用 wkhtmltopdf 0.12.4 或 0.12.5 您可以在 wkhtmltopdf 命令行上使用 --dpi 300，几乎可以解决问题。如果放大很多，您可能仍会注意到一些字母的间距差异可以忽略不计，但字母不再重叠。 --dpi 600 使它近乎完美。在我的场景中渲染的 pdf 文件大小没有增加。

Answer 8

我遇到了同样的问题。我不得不添加标志 --disable-smart-shrinking 然后通过逐渐增加和减少来玩 dpi。

    wkhtmltopdf --page-size A4 --print-media-type --lowquality --disable-smart-shrinking --encoding UTF-8 --no-outline --image-quality 100 --javascript-delay 3000 --orientation Portrait --dpi 65 --margin-top 0in --margin-right 0in --margin-bottom 0in --margin-left 0in "http://localhost:3000/wa/reports/"

Answer 9

在 CSS 中为正文添加以下代码

body {
font-kerning: normal;
text-rendering: optimizeLegibility;
}

和--dpi 200。这对我有用。

Answer 10

wkhtmltopdf 关于字母间距的计算有误。我设法将其确定为 100+ dpi 结果正好是那个倍数，将 dpi 视为 'percentage'。换句话说：

如果您使用 --dpi 500 进行渲染；确保将字母间距除以 5
如果您使用 --dpi 300 进行渲染；确保将字母间距除以 3
等等

您可以使用所有 --dpi 92 选项，但随后您会遇到字距调整不佳和图像模糊的问题，您需要再次解决所有这些问题。

在我的解决方案中，我进行了正则表达式替换，它会在将 html 字符串移交给 wkhtmltopdf 之前重新计算在 html 字符串中找到的任何此类字母间距。

Answer 11

使用Google或其他在线字体是一个可以尝试的选项。就像在提到的 post 中一样，它已被用于解决 Rotativa 中的相同问题。

wkhtmltopdf 的字母间距太大

letter-spacing is too large with wkhtmltopdf

wkhtmltopdf