【问题标题】:wkhtmltopdf with full page background具有整页背景的 wkhtmltopdf
【发布时间】:2011-08-28 19:18:11
【问题描述】:

我正在使用 wkhtmltopdf 生成一个 PDF 文件,该文件将被打印到打印机上,并且在使内容填满生成的 PDF 中的整个页面时遇到了一些麻烦。

在 CSS 中,我将宽度和高度设置为 2480 X 3508 像素(a4 300 dpi),在创建 PDF 时,我使用 0 作为边距,但最终在右侧和底部仍然有一个小的白色边框。也尝试使用 mm 和百分比,但结果相同。

我需要有人提供一个示例,说明如何设置 HTML 样式以及在命令行中使用哪些选项,以便生成的 PDF 页面填满整个背景。一种方法可能是包括出血(无论如何这可能是必要的),但欢迎任何提示。目前我正在创建一个大的 HTML 页面(没有 CSS 分页符 - 可能有帮助?)但如果需要,可以单独生成每个页面,然后将它们全部提供给 wkhtmltopdf。

【问题讨论】:

  • 嗨,您解决了这个问题吗?

标签: wkhtmltopdf


【解决方案1】:

使用 -B 0 -L 0 -R 0 -T 0 选项并使用设置 A4 大小的 div 的技巧对我来说效果很好。

你记得使用 body {margin:0; padding:0;} 在 CSS 的顶部?

我无法帮助您处理 CSS 分页符,因为我还没有尝试过错误的那些,但是,您可以在页面上运行脚本来做一些聪明的事情。这是一个 jQuery 示例,说明如何根据内容的长度将内容拆分为页面大小的块。如果您可以使其适应 wkhtmltopdf,请在此处发布!

http://www.script-tutorials.com/demos/79/index.html

【讨论】:

    【解决方案2】:

    您遇到的是一个错误。

    您需要在转换文件时设置--dpi 选项。在您的情况下,您可能需要--dpi 300,但可以设置得更低。

    【讨论】:

      【解决方案3】:

      http://code.google.com/p/wkhtmltopdf/issues/detail?id=359,我发现更多的人“遭受”了这个错误。 --dpi 300 解决方法对我不起作用,我不得不将 --zoom 1.045 设置为放大一点,这使得额外的右边框和下边框消失...

      【讨论】:

      • 此处类似 - 试图使用整页(8.5 x 11 英寸)div 作为容器,但只得到大约 8 3/16 x 10 7/16。 1.045 的缩放使一切正常。
      • 1.17647 的缩放系数对我有用(8.5 x 11 英寸)在这里得到了这个系数:code.google.com/p/wkhtmltopdf/issues/detail?id=408#c9
      • 这些问题链接现已失效
      • 8.5 x 11 in 在 Windows 7 的横向上我需要 1.25 的缩放 (wkhtmltopdf 0.12.3.2 (with patched qt))。然后我意识到我将disable-smart-shrinking 设置为False。将其更改为 True(关闭智能收缩)和 1.045 也可以在这里工作。
      【解决方案4】:

      wkhtmltopdf v 0.11.0 rc2

      结果如何:

      wkhtmltopdf --margin-top 0 --margin-bottom 0 --margin-left 0 --margin-right 0 <url> <output>
      

      缩短为

      wkhtmltopdf -T 0 -B 0 -L 0 -R 0 <url> <output>
      

      使用标准输入中的 html(注意破折号)

      echo "<h1>Testing Some Html</h2>" | wkhtmltopdf -T 0 -B 0 -L 0 -R 0 - <output>
      

      使用 html 从标准输入到标准输出

      echo "测试一些 Html" | wkhtmltopdf -T 0 -B 0 -L 0 -R 0 - test.pdf

      echo "测试一些 Html" | wkhtmltopdf -T 0 -B 0 -L 0 -R 0 - - > test.pdf

      什么没有起作用:

      • 使用--dpi
      • 使用--page-width and --page-height
      • 使用--zoom

      【讨论】:

      • 您将失去背景图像的分辨率,而无需 dpi 、 zoom 。你知道怎么解决吗?我在这里使用 svg 渲染。有背景,里面有很多物体
      【解决方案5】:

      我意识到这是旧的和冷的,但以防万一有人发现这个并遇到相同/相似的问题,这是经过一些试验和错误后对我有用的解决方法。

      我创建了一个简单的filler.html:

      <!DOCTYPE html>
      <html>
      <head>
      </head>
      <body style="margin: 0; padding: 0;">
      <div style="height: 30mm; background-color: #F7EBD4;">
      &nbsp;
      </div>
      </body>
      </html>
      

      使用有效的 HTML(!DOCTYPE 很重要)并且只能使用内联样式。将背景颜色与主文档的颜色匹配,并使用等于或大于边距的高度。

      我使用以下参数运行版本 0.12.0:

      wkhtmltopdf --print-media-type --orientation portrait --page-size A4
       --encoding UTF-8 --T 10mm --B 10mm --L 0mm --R 0mm
       --header-html filler.html --footer-html filler.html - - <file.html >file.pdf
      

      希望这对某人有所帮助...

      【讨论】:

      • 谢谢 - 如果您使用边距进行渲染,那么让虚拟 div 具有固定高度以匹配边距是关键点。非常感谢你做的这些!我花了几个小时试图解决我的渲染问题。
      【解决方案6】:

      我使用的是 0.12.2.1 版本并设置:

      body { padding: 0; margin 0; }
      div.page-layout { height: 295.5mm; width: 209mm;}
      

      为我工作。

      当然需要加0边距:

      wkhtmltopdf -T 0 -B 0 -L 0 -R 0
      

      【讨论】:

      【解决方案7】:

      我们刚刚通过使用--disable-smart-shrinking 选项解决了同样的问题。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2014-09-05
        • 1970-01-01
        • 1970-01-01
        • 2014-01-16
        • 2015-01-12
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多