Css 打印时未分页的DIV

Css 打印时未分页的DIV,css,printing,Css,Printing,我有一个包含DIV的页面。这个DIV是其他元素的容器,打印时其高度可以增加到大于页面高度 我以为它会毫无问题地分页。我看到的问题是DIV的高度增加到了第1页的整个高度,就这样。打印输出的第1页外不再显示更多内容 经过一点实验,我发现display:inline似乎可以解决这个问题。我不明白为什么 如果这确实是问题的解决方案,请有人解释一下为什么这可以解决我的问题 我想了解为什么这样做有效。@您的评论:您在正确的时间提出了正确的问题,因为我目前正在做完全相同的工作:)我将分享一些截图来显示结果;我

我有一个包含DIV的页面。这个DIV是其他元素的容器,打印时其高度可以增加到大于页面高度

我以为它会毫无问题地分页。我看到的问题是DIV的高度增加到了第1页的整个高度,就这样。打印输出的第1页外不再显示更多内容

经过一点实验,我发现
display:inline
似乎可以解决这个问题。我不明白为什么

如果这确实是问题的解决方案,请有人解释一下为什么这可以解决我的问题


我想了解为什么这样做有效。

@您的评论:您在正确的时间提出了正确的问题,因为我目前正在做完全相同的工作:)我将分享一些截图来显示结果;我认为打印一个非常大的表需要一个非常复杂的解决方案,但对于我的表来说,它可以工作(我称之为“中等”)

在我的应用程序中,容器div中有一个表,其中块元素的display设置为table cell(使用float和margins时列宽不一致)

1.正常网络视图中的页面

2.将打印媒体查询放入样式表后的页面,在print中:(不介意暗div,它是一个我还没有移除的掩码)正如您所看到的,该表覆盖多个页面,并水平缩放以适合

@媒体打印{
#数据{溢出:可见;高度:自动;}/*容器div*/
.bld{display:block}/*您在表中看到的块,web display:table cell*/
/*我测试了所有表{display:inline、inline table和table},它们
所有这些都为我工作,如下面的屏幕截图所示*/
}

3.要将分页符设置为打印到某个div(可能是row),我会让您参考这篇文章,因为我自己还没有尝试过,但可能值得一读:

另一种方法是将一个div放在x行第一列的某个位置,然后将这个div设置为CSS
分页符后:always
强制在这些行上分页符。我在tr、td和表上测试了一些分页符,但没有成功(因为tr的样式与其他HTML元素有些不同)

4.作为表格不同显示值之间差异的参考:


我也会读一读,如果你发现与这个话题相关的其他有趣的东西,请在评论中给我发一个@,谢谢

我只是想知道——我已经测试过打印一个长div和内容,display属性真的改变了那么多吗?我的意思是,在我的页面上,内容被自动放置在多个页面上,而无需我固定任何位置……它很可能是与显示属性相结合的其他内容。正如我所说,我确实希望它是自动的。顺便提一下,你知道如何打印带有水平和垂直分页的大型表格吗?:)哇,非常感谢-里面有很多信息,我需要花时间去消化和阅读链接的帖子。再次感谢