CSS - 打印正确分页的大型列表？

Question

我尝试将jsTree内容准备好进行打印，并且我在页面边距方面遇到了一些麻烦。问题是页面上的最后一行是他的身高。请看这个 -

是否可以修复它？

P.S。我准备了拉链示例，只有jsTree文件 - download

Answer 1

您需要使用page-break-inside并在@media查询中使用它。

@media print {
  ul, ul li {
    page-break-inside: avoid;
  }
}

这将告诉浏览器何时处于打印模式，避免断行或文本。

当前浏览器支持：

• Chrome - 1.0 +
• Firefox（Gecko） - 19.0 +
• Internet Explorer - 8.0 +
• Opera - 7.0 +
• Safari - 1.3+（312）

Answer 2

在page-break-inside: avoid;元素上设置<li>。