Question

根据W3.org，样式page-break-after适用于块级元素（http://www.w3.org/TR/2004/CR-CSS21-20040225/page.html#page-break-props）

<tr>是一个块级元素（根据这个：http://www.htmlhelp.com/reference/html40/block.html，它是）

我这样做，但分页时打印时没有创建实际的分页符：

  <table>
    <tr><td>blah</td></tr>
    <tr><td>blah</td></tr>
    <tr style="page-break-after: always"><td>blah</td></tr>
    <tr><td>blah</td></tr>
  </table>

我这样做的方法是否正确？

如果<tr>不是块级元素：我打算如何实现此分页符？

注意：之前的代码只是一个例子，但我想要做的是在表格的每5行放一个分页符，所以如果你知道任何有关该案例的提示，将不胜感激

Answer 1

在<head>内，设置此样式

<head>
    <style>
        @media print {
            tr.page-break  { display: block; page-break-before: always; }
        }   
    </style>
</head>

这样，它会在此表格行之前的打印过程中产生分页符。

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

Answer 2

The site you referenced声明<tr>“也可能被视为块级元素，因为可能包含块级元素。” W3.org或Mozilla docs状态<tr>都不是块级元素。

一些可能的解决方案

根据措辞和您的示例，我将确保单元格包含真正的块级元素。以下是使用<h1>和<p>的两个示例，它们是块级文本元素。

<tr style="page-break-after: always"><td><h1>Next Section</h1></td></tr>
<tr style="page-break-after: always"><td><p>This will be a new page.</p></td></tr>

其他人报告了类似的问题，其中一个解决方案可能适合您。
如My Lister所述，您可以attempt to catch the printing action或生成将表格分开的页面的打印版本，以便您可以在每五行之后获得所需的分页符。< / p>

Answer 3

使用<tr>设置所有display:block标签，并定义表和单元格的页面格式以及以mm为单位的大小。

这里<td>标签宽度设置为23mm，因为有10个td标签，每边填充2mm（23 + 2 + 2）* 10 = 270，即<table>宽度。

您可以根据自己的构词方式来调整word-break。

@media print {

    @page {
        size:A4 landscape;
        margin: 5mm 5mm 5mm 5mm;
        padding: 0mm 0mm 0mm 0mm;
    }
    .table{
        width:270mm;
        min-width:270mm;
    }
    td, th{
        padding: 2mm 2mm 2mm 2mm !important;
        display: table-cell;
        word-break:break-all;
        width:23mm;
        min-width:23mm;
    }
    tr{
       display:block;
    }
    tr.page-break  { 
       page-break-before: always; 
    }
}

将“page-break-before”应用于表格行（tr）

3 个答案: