如何阻止HTML打印破坏容器元素？

Question

我正在动态地从数据库中加载HTML，然后格式化它并将其打印到纸上。很多时候，分页符位于DIV或其他容器元素的中间。如何设置输出的格式，使其不这样做？

​

​

Answer 1

您将需要创建一个带有媒体查询的打印样式表，以便只针对打印设备。CSS有一个子集，可用于打印媒体的样式。您可以在这里找到详细的语法帮助。

CSS Printing: Avoiding cut-in-half DIVs between pages?

Answer 2

答案是CSS

page-break-inside: avoid;

像这样使用：

<div style="page-break-inside: avoid;">
  text goes here
</div>