Question

注意删除任何填充或边距，我创建了一个基本的html页面，其中包含一个表格，其高度应为297毫米（A4纸张高度）：

<!DOCTYPE html>
<html>
  <head>
  <style>
    body 
    {
      padding: 0; /* Padding for content */
      margin: 0 auto; /* Margin from container */		
    }    	
    table
    {
      padding: 2.5mm 5mm; /* Padding for content */		  
      margin:0; /* Margin from container */

      width:100%;
      border-spacing:0;
      background-color:yellow;
				
      height:297mm;
    }
  </style>
  </head>
  <body>
    <table>
      <tr style="height:3%"><td style="background-color:RGB(235, 105, 11)">1</td></tr>
      <tr style="height:30%"><td style="background-color:RGB(47,52,57)">2</td></tr>
      <tr style="height:17%"><td style="background-color:RGB(94,98,102)">3</td></tr>
      <tr style="height:auto"><td style="background-color:RGB(255,255,255)">4</td></tr>
      <tr style="height:13%"><td style="background-color:RGB(47,52,57)">5</td></tr>
    </table>
  </body>
</html>

我正在尝试使用wkhtml2pdf实用程序以A4 PDF格式呈现此内容（再次注意删除任何边距和/或填充：

wkhtmltopdf.exe --page-size A4 -L 0 -R 0 -T 0 -B 0 .\testsize.html testsize.pdf

无论如何，PDF文档中渲染的表高度似乎不是297mm。它似乎更小：

只有在将表格高度修改为height: 371mm时，我才可以在PDF文档中填写A4纸张的全高（NB：371mm / 291mm几乎是x1.25比率）。

您是否知道渲染高度的比率来自何处以及如何解决？

NB1：据我所知wkhtml2pdf使用webkit作为渲染引擎
NB2：当使用zoom = x1在chrome中显示html代码时，显示的高度已经与并排放置的A4 PDF文档不匹配，缩放也设置为x1。

Answer 1

我不确定wkhtmltopdf是否尊重mm CSS单元。也就是说，您可以尝试调整一些命令行选项来修改HTML文档大小和呈现的PDF之间的比率：

--zoom <float>：我认为这个是你个案中最重要的一个。尝试设置为--zoom 1.25，即您估算的比率。
--disable-smart-shrinking：根据我的经验，此命令通常会阻止元素大小具有意外值。
--dpi <number>：我不确定这是否会改变某些内容，但请尝试300或600。

wkhtml2pdf渲染大小问题

1 个答案: