我想制作漂亮的大桌子打印出来,每个桌子都有自己的ID,把每个桌子放在一张新纸上。我直接将 css 样式分页符之前应用于样式表中的每个表 ID。
像这样的 HTML :
<table id="T1">...</table>
<table id="T2">...</table>
像这样的CSS:
#div1 #div2 #T1, #div1 #div2 #T2, ... {diplay: inline; page-break-before: always;}
这在 Chromium 中不起作用,在 Firefox 中,它只将分页符放在第一个元素上,而忽略下表元素。风格是"高度选择"的,作为火虫的顶级属性。
当我读到分页符属性不适用于绝对定位的元素时,我放置了"display:inline;"属性,所以我对块显示也有疑问......
我真的想不通我做错了什么......
根据此链接:
https://developer.mozilla.org/en-US/docs/CSS/page-break-before
它仅适用于块元素。因此,您应该使用display:block
或者只是将显示值保留为自动,这将呈现为表格(表格是块元素)。如果position:absolute
与page-break-before
混合会起作用,我会感到非常惊讶......所以我建议你尝试没有绝对定位,看看会发生什么。
还有什么理由让你对你的选择器如此具体:
#div1 #div2 #T1, #div1 #div2 #T2, ...
只是为了确保那里没有错误,最好只使用:
#T1, #T2, ... {}
毕竟,ID 应该是唯一的。
另一方面,上面的链接说明了尝试使用break-before
...你可以试一试,看看它是否有帮助?