wkhtmltopdf重复标题重叠内容答案

【问题标题】：wkhtmltopdf repeating thead headers overlapping contentwkhtmltopdf重复标题重叠内容
【发布时间】：2014-07-09 08:05:50
【问题描述】：

我们将 wkhtmltopdf (0.12.1) 嵌入到 Java 应用程序中，使用标准输入和标准输出进行输入/输出。我们希望 PDF 中有多个（不同的）标题，因此我们不使用--header-html 选项，而是使用thead，它在多个页面上重复。这是一个小示例 HTML：

<!DOCTYPE html>
<html>
<body> 
    <table style="page-break-after: always;">
        <thead>
            <tr>
                <th>My first header</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>First content</td>
            </tr>
        </tbody>
    </table>
    <table>
        <thead>
            <tr>
                <th>My second header</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>Second content</td>
            </tr>
        </tbody>
    </table>
</body>
</html>

到目前为止一切顺利。当内容跨越多个页面时会出现问题。然后标题会显示在内容的顶部，并与其重叠。例如html 和PDF。请注意，第二个标题渲染得很好，因为tr 只跨越一页。

其他人也遇到过类似的问题。当您使用--header-html 选项时，有一些解决方法，例如添加--header-spacing 或--margin-top，但这些选项对重复的thead 没有影响。有什么想法吗？

【问题讨论】：

这是 wkhtmltopdf 的一个已知问题，请参阅issue 1524。

标签： wkhtmltopdf

【解决方案1】：

我用这三个 css 规则解决了它：

thead { display: table-header-group; }
tfoot { display: table-row-group; }
tr { page-break-inside: avoid; }

【讨论】：

我们有一个复杂的多行标题，包含多个 colspans 和 rowspans，这个解决方案非常适合我们。
非常感谢！！我很长一段时间都遇到了这个错误的问题，这个解决方案在我的 PDF 中完美运行
在我的测试中，使用 thead 或 tr 规则有效。似乎只需要轻推一下:-)
这是一个较老的问题，但这个解决方案对我有用。
为我完成了这项工作

【解决方案2】：

您可以通过添加以下 css 来解决此问题。

   tr {
         page-break-inside: avoid;
      }

【讨论】：

【解决方案3】：

我发现tr { page-break-inside: avoid; } 工作到了一定程度，但当我的标题跨越多行时却没有。由于我想保留我的 thead 部分，我的解决方案是关闭重复。

thead, tfoot {
  display: table-row-group;
}

【讨论】：

这对我有用！
这导致后面的页面不打印theader (wkhtmltopdf 0.12.5-1.msvc2015-win32)