CSS打印:避免在页面之间剪切半个div?

我正在为一个软件编写一个插件,该软件在Cocoa的WebView中获取大量项目并将它们弹出到HTML中(它使用WebKit作为其呈现程序,因此基本上可以假设此HTML文件是在Safari中打开的)

它制作的div具有动态高度,但变化不大。它们通常在200像素左右。不管怎么说,每个文档大约有600个这样的项目,我很难把它打印出来。除非我走运,否则每页的底部和顶部都有一个条目被切成两半,这使得实际使用打印输出非常困难

我以前尝试过分页符,之后尝试过分页符,内部尝试过分页符,三者的组合都没用。我想可能是WebKit没有正确地呈现说明,或者是我不了解如何使用它们。无论如何,我需要帮助。如何防止打印时裁掉一半的div

使用break-inside应该可以:

@media print{
div{
破门而入:避免;
}
}

它适用于所有主要浏览器:

  • 铬50+
  • 边缘12+
  • 火狐65+
  • 歌剧37+
  • 狩猎10+

在内部使用分页符:避免也应该可以工作,但被break-inside:avoid完全否决了

发表评论