css - css page-break-before 属性仅适用于页面中的第一个表格元素（firefox）

Question

我想制作漂亮的大表格打印件，每个表格都有自己的 ID，并将每个表格放在一张新纸上。我将 css 样式 page-break-before 直接应用于样式表中的每个表 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 中，它只将分页符放在第一个元素上并忽略下表元素。该样式是“高度选择的”，作为萤火虫中的顶级属性。

我把“显示：内联；” 属性，因为我读到分页符属性不适用于绝对定位的元素，所以我对块显示也有疑问......

我真的想不通我做错了什么......

score 0 · Accepted Answer

根据此链接：

它仅适用于块元素。因此，您应该使用display:block或将显示值保留为自动，这将呈现为表格（表格是块元素）。position:absolute如果混合会起作用，我会感到非常惊讶page-break-before......所以我建议你尝试不使用绝对定位，看看会发生什么。

还有什么理由让您对选择器如此具体：

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

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

#T1, #T2, ... {}

毕竟 ID 应该是唯一的。

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

1 回答 1