打印时避免使用div / tables切割

Question

我使用可编辑的发票模板来制作发票。它在浏览器上看起来很棒但是当在表格中添加了一定数量的项目时，底部（如图中所示）会像这样被剪切。我该如何解决？我希望它在项目很多时自动打印到第二页，并在第一页打印时很好。

谢谢！

Answer 1

对于表格，您应该使用<thead>，<tbody>和<tfoot>标记。如果您需要<tfoot>，则应进行试验。另外两个非常有用。您的桌子的标题将在每个页面上重复，这将使您的桌子看起来不那么多。 <tfoot>还会在每个页面上复制您定义为页脚的内容，这可能是不可取的。

对于 divs ，您应该尝试使用page-break-before或page-break-after CSS 命令。虽然如果你有一个页面填充div这些对你没有帮助，但它们可以帮助你处理较小的那些。

Answer 2

尝试为div添加此css样式：

page-break-inside: avoid;