打印HTML表而不在两个页面之间拆分行

时间:2011-07-05 17:05:00

标签: html css internet-explorer printing safari

我需要在Internet Explorer(各种版本)和OS X上的Safari中打印HTML表中的一些数据。暂时忽略Safari。

当打印具有比可装在页更多行的表,页上的最后一行通常分割与所述第一页和下一页上的行的其余部分上的行的一部分。

这看起来很难看。有没有办法避免它?

我一直在寻找周围,到目前为止,我已经找到page-break-before: always,但我不知道这就是我要找的,因为我不知道前面的多行会如何适应在页面上。例如根据内容,行可能更高或更短,用户可能以纵向或横向模式打印。我至少假设A4,但如果用户使用的是美国信或其他纸张尺寸,则会带来更多的不确定性。另外,打印机边距怎么样?

那么有办法解决这个问题吗?或者我只需要猜测适合多少行并在此之后强制分页?这甚至会起作用吗?

4 个答案:

答案 0 :(得分:12)

您可能想要使用page-break-before/after: autopage-break-inside是理想的,但大多数浏览器都是not supported

在这里http://www.westciv.com/style_master/academy/css_tutorial/advanced/printing.html查看一些有用的信息。

答案 1 :(得分:3)

page-break-inside:avoid怎么样?

似乎有a lot谈论这个,但我也发现另一个SO article提到page-break-before:auto并适用于每个表格单元格。

答案 2 :(得分:0)

为避免在Safari上打印分割细胞:

tr
{
    display: block;
    page-break-inside: avoid;
    -webkit-region-break-inside: avoid; 
}

答案 3 :(得分:0)

A few simple solutions确实存在用于防止行内的分页符,但是它们有一些非常大的限制,这些限制往往会使它们对除内联网之外的任何内容都无用。

可以找到一个更加通用的解决方案here。它的主要缺点是它需要固定的列宽。

我最喜欢的解决方案相当复杂,但最终可能会导致最少的麻烦。它使用JavaScript将每一行转换为一个单独的,不可破坏的块(但不会影响表的外观)。我发布了一些使用这种技术的答案: