CSS page-break-before属性仅适用于页面中的第一个表元素(Firefox)



我想制作漂亮的大桌子打印出来,每个桌子都有自己的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:absolutepage-break-before混合会起作用,我会感到非常惊讶......所以我建议你尝试没有绝对定位,看看会发生什么。

还有什么理由让你对你的选择器如此具体:

#div1 #div2 #T1, #div1 #div2 #T2, ...

只是为了确保那里没有错误,最好只使用:

#T1, #T2, ... {}

毕竟,ID 应该是唯一的。

另一方面,上面的链接说明了尝试使用break-before...你可以试一试,看看它是否有帮助?

最新更新