css - 打印时防止表格分页

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:始终在其中以强制创建新表格。

这会大致为您提供所需的内容，但并不完美。每隔一段时间，你就会有一个“可能”适合上一页的表格，但并没有完全达到要求，因为你必须在估计一页适合多少行的低端.

不过，我还没有想出一种方法来判断单元格内的内容或类似内容在打印到打印输出页面时是否会换行。

希望这能激发您的灵感。