分页符不适用于表格

Question

>我在打印时尝试了下面的代码，用于表格特定行后的分页符。它没有破坏页面。打印时，所有行都显示在同一页上。

.page-break {
page-break-after: always;
}

<tr class="page-break">
<td>--</td>
</tr>

Answer 1

不确定是否可以在<tr>(不是块级元素(上使用它

"适用于根元素正常流中的块级元素。用户代理也可以将其应用于其他元素，如表行元素。

https://developer.mozilla.org/en-US/docs/Web/CSS/page-break-after

Answer 2

您缺少@media打印。该媒体查询特定于您设置要打印的内容的时间。

https://www.w3schools.com/cssref/pr_print_pageba.asp

答案更新：

经过一些搜索，@anderssonola关于无法将其与<tr>一起使用是正确的。因此，您将有几个选项，具体取决于您设置页面的方式。我头顶上的那些在下面：

选项 1 = 使用<div>将它们分开。

为此，您可以执行以下操作：

@media print {
div.page-break {page-break-after: always;}
}

<table>
<tr>
<td>Page One</td>
</tr>
</table>
<table>
<div class="page-break">
<tr>
<td>Page Two</td>
</tr>
</div>
</table>

选项 2 = 使用<table>将它们分开。

@media print {
.page-break {page-break-after: always;}
}

<table class="page-break">
<tr>
<td>Page One</td>
</tr>
</table>
<table class="page-break">
<tr>
<td>Page Two</td>
</tr>
</table>

选项 3 = 使用 HTML5 元素将它们分开。

@media print {
section {page-break-after: always;}
}

<section>
Page One
</section>
<section>
Page Two
</section>