打印html div而不破坏两页之间的内容

Question

当我使用window.print（）打印我的网页时，结果将是几页。我有一些html div元素，两个页面之间不能断开。虽然，因为页面内容是动态创建的，所以我无法知道我的div何时会被破坏。

是否有任何css或javascript可以用来告诉两个页面之间不能断开特定的div？

我看到了css规则“page-break-before”，我可以使用我的div，但即使在可以避免的情况下也会导致分页（不必要地增加总页数）。

Answer 1

你最好的选择是（但有兼容性问题）

.noBreak { page-break-inside: avoid;  } 

当前兼容性（source）：

Chrome     Firefox (Gecko)    Internet Explorer    Opera     Safari (WebKit)
1.0        19.0 (19)          8.0                  7.0       1.3 (312)

其他SO讨论：alternative to page-break-inside:avoid because of compatibility issues

W3Schools

Answer 2

有必要连接另一个css进行打印：

<link type="text/css" rel="stylesheet" media="print" href="PATH_TO_CSS" />

并仅为打印而编写样式。