Chrome上的iframe中的分頁符不起作用？

Question

我的應用程序內部有一個iframe，如果我在某個div上添加了分頁div ，則在Chrome上將其忽略（在Safari中，它可以按預期運行）。

我只有控制分頁符的此打印CSS：

page-break-before: always; page-break-inside: avoid;

另外，如果我將iframe作為單獨的頁面打開，分頁符也可以按預期工作。

Answer 1

父級和要控制分頁的元素必須聲明為：

position: relative;

這適用於：

page-break-before
page-break-after
page-break-inside

但控制page-break-inside無法在Safari上使用（已在5.1.7版上測試）

Answer 2

我在同一個問題上掙扎。 在我的方案中，我使用隱藏的iframe無縫加載易於打印的內容，然后觸發打印對話框。 通過在iframe元素上指定0px（甚至1px）的寬度，Chrome可以有效地忽略我的打印CSS。

通過僅指定0px的高度並保持寬度不變，Chrome開始采用打印樣式。