page-break-before：避免媒体打印不起作用

Question

在尝试使用 wkhtmltopdf 诊断分页符问题时，创建了一个人为的.html文档，该文档似乎不符合我声明page-break-*规则。

如果我在 chrome 打印对话框中打开它，该文档第一页上的最后一行是读取的 div 部分之一。 它具有page-break-after:avoid样式集，第二页上的第一个块具有page-break-before:avoid样式集。 我认为其中任何一个（特别是结合起来）都意味着红色文本应该是第二页上的第一件事，但它似乎不像那样工作。

我对媒体打印功能的方式有什么误解吗，或者那些 styles 是如何应用的？

我尝试了各种元素，div、span、tables，添加了!important ，但似乎没有一个元素表现得像我期望的那样。

易于使用的图像

Answer 1

问题似乎出在浏览器上——所有浏览器——而不是你的代码。 在我的 css 样式表中，我指定了

@media print {
    h3, h4 { page-break-after: avoid; }
}

但是当我使用我拥有的任何浏览器打印时，我的代码完全没有效果。 我什至尝试了 iCab， caniuse.com （@Bazaim 提供的链接）不包含的浏览器，它也没有遵循 css @media 打印样式方向。