So vermeiden Sie die Paginierung innerhalb von Tabellenzeilen

Question

Ich möchte beim Konvertieren von HTML in PDF die Paginierung innerhalb von Tabellenzeilen über wkhtmltopdf vermeiden. Ich habe page-break-inside:avoid mit Tabelle verwendet und es hat funktioniert, aber nicht, wenn es viele Zeilen gibt. Wenn die Anzeige auf Block oder andere Methoden eingestellt ist, wird das Format der Tabelle geändert und es werden doppelte Ränder eingefügt. Oder Sie können auf jeder Seite eine Tabellenüberschrift einfügen, die beim Teilen der Tabelle angezeigt wird.

Answer 1

我发现在webkit浏览器中处理这个问题的最佳方法是在每个td元素内放置一个div，并将page-break-inside: avoid样式应用于div，如下所示：

...
<td>
  <div class="avoid">
    单元格内容。
  </div>
</td>
...
<style type="text/css">
  .avoid {
    page-break-inside: avoid !important;
    margin: 4px 0 4px 0;  /* 为了避免页面断开太接近div内的文本 */
  }
</style>

尽管Chrome据说不识别'page-break-inside: avoid;'属性，但使用wktohtml生成PDF时，这似乎可以防止行内容被页面断开分成两半。 tr元素可能会稍微超出页面断开，但div和其内部的任何内容都不会。

Answer 2

你可以尝试使用CSS来实现：

<table class="print-friendly">
 <!-- 这里是你的表格的其余部分 -->
</table>

<style>
    table.print-friendly tr td, table.print-friendly tr th {
        page-break-inside: avoid;
    }
</style>

大多数CSS规则不能直接应用于<tr>标签，因为正如你上面指出的那样-它们具有独特的display样式，不允许这些CSS规则。然而，其中的<td>和<th>标签通常允许这种规范-你可以使用上面示例中的CSS轻松地将这些规则应用于所有子<tr>和<td>。