Question

我有一个我正在尝试设置打印的页面。此页面包含大量单个表。这些表的大小各不相同，但一般来说，我每页可以容纳2.5到3个表。我希望能够防止表被分页符破坏。知道我怎么能做到这一点吗？

我试过了：

.reportTable {
    page-break-inside: avoid;
}

不幸的是，page-break-inside似乎只支持Opera（根据W3Schools - 我确认这在Firefox 4.0.1中不起作用）。

我可以这样做以在每个表之后强制分页：

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

这适用于插入分页符并且似乎在所有主流浏览器中都受支持，但它在打印文档上留下了大量浪费的空间（大约每页的一半是空白的）。如果整个下一个表格不适合此页面，我真的只想要一个分页符。

我知道我有用户使用Internet Explorer，Firefox和Safari，所以我真的希望尽可能地支持这些用户。找到一些可以在Chrome和Opera中运行的东西将是一个非常好的奖励。

有什么想法吗？

Answer 1

我也一直在寻找答案。我最接近的是知道页面上大约有多少行输出，然后计算页面输出的行数。在你的情况下： 1）弄清楚你可以在页面上放置多少行输出。 2）通过显示您的第一张表来跟踪您已经使用了多少行。 3）计算表2将采用多少行。将其添加到表1的行中，看看您是否仍然低于近似阈值。如果是，请显示表格，如果没有，请使用分页符放下一个div：总是在其中强制使用新表格。

这会给你大概你想要的东西，但它不会是完美的。每隔一段时间，你就会有一张“可能”适合上一页的表格，但只是没有完全截止，因为你必须处于估算页面上适合的线数的低端。

但是，如果单元格内的内容或类似内容在刷入打印输出页面时会进入新行，我还没有找到方法。

希望能给你一个想法。

Answer 2

目前，似乎没有办法强制不支持page-break-inside: avoid的浏览器这样做。

但是，由于每页可以容纳2.5到3个表，并且不想使用page-break-after: always;只打印一个表，您可以选择插入一个特殊的{{1}在每个两个表之后强制分页。

所以你要包括div并将其隐藏在屏幕上，但显示它以便打印。你会给它一种<div class="pageBreak"></div>的风格。这样，每页至少可以获得两个表。

另一个建议是让用户决定他/她是否想要每页打印一张桌子或者是否适合打印一张桌子（有些可能在页面上分开）。您可以切换page-break-after: always;以将checkbox样式添加到表格中。

Answer 3

修复此问题 #table {分页-后：汽车;}

Answer 4

这是一个非常老的问题，所以只想更新page-break-inside：现在大多数主流浏览器都支持该功能。尽管有一些奇怪的方法来确保page-break-xxx可以正常工作（任何级别的父级都不能定位：固定，元素和直接父级必须定位：相对和显示：块等）。

参考： https://developer.mozilla.org/en-US/docs/Web/CSS/page-break-inside

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

Answer 5

并非所有打印机都是平等创建的。

您遇到问题，因为打印机不受网络浏览器或HTML代码控制。它由打印机附带的打印机驱动程序控制。此功能（及其设置）属于呈现页面的计算机的所有者，而不属于您。

您的代码无法预先知道打印机连接到用户系统的行数可以放在页面上，或打印机如何布置表格。如果具有不同打印机的用户打开页面，则会有所不同。就像不同的屏幕分辨率一样，有不同的打印机像素分辨率。

因此，适用于不同屏幕的所有规则（及其缺点）也适用于不同的打印机。您不仅不知道打印机在哪里打破页面，甚至无法知道打印页面的大小，就页面上的内容大小而言。

要将所有表格（或多个表格）放到页面上，用户应选择要打印的部分，然后在打印机对话框中使用“打印选择”。

打印时防止表中的分页符

5 个答案: