5

使用 0.79 和 0.7.2 生成的 PDF 看起来与我的原始 HTML 略有不同。添加 show_as_html 标志按预期显示它,但是内联样式在 PDF 中的处理方式与它们在 HTML 预览中的处理方式不同。

具体来说,我遇到的问题是字母间距声明也没有正确呈现浮点数。因此,例如在具有字母间距的右侧浮动元素上,PDF 将字符间距过大并且从中心间隔开,以使文本部分离开屏幕而不是进一步向左碰撞以改变字母间距宽度.

这是原始的 HTML 片段:

<table width="800" border="0">

  <tr>
    <td colspan="3"><span style="font-family:Helvetica, Arial, sans-serif;font-size:10pt;margin-top:18px;text-transform:uppercase;float: right;letter-spacing:2pt">Winter 2013</span></td>
  </tr>
</table>

这是进行渲染的代码:

render :pdf => 'file_name', :template => 'template.html.erb', :layout => 'pdf.html'

这是呈现的 HTML:http: //jsfiddle.net/wX4DQ/

这是输出的 PDF:http: //imgur.com/sdUPM

我注意到关于wkhtmltopdf的一些错误报告似乎与此相关。这可能是这个问题的罪魁祸首,什么是可以接受的解决方法?

我尝试过不同的字体,但我真的必须使用 Helvetica。

关于在这里做什么或可行的解决方法有什么建议吗?

4

2 回答 2

3

有很多事情会导致文本呈现和字母间距出现问题。如果您使用的是二进制文件,请尝试获取针对 QT 编译的二进制文件。如果您自己编译 wkhtmltopdf,请确保您编译它的系统安装并注册了一套不错的字体,否则字体看起来不正确。

此外,这一点 css 可以提供帮助,尤其是在复制/粘贴某些字符之间有随机额外空格的情况下:

body { text-rendering: optimize-speed; }
于 2012-09-03T14:45:07.413 回答
0

我有一个类似的问题,我设法通过font-family从谷歌导入的更改来解决它。更多细节和可能的解决方法可以在这个问题中找到。简而言之,这是解决问题的代码:

@import url('https://fonts.googleapis.com/css?family=Open+Sans');
body {
    font-family: "Open Sans";
}
于 2016-07-07T14:20:10.463 回答