CSS打印预览页面被剪切

Question

如您在该图像中所看到的，当第一个表具有更多记录时，下一个表的标题将被剪切，分页符之前的表有时很长，有时又很短。

如何在底部进行动态边距调整？ 为了避免不必要的截止？

    @page {
      margin-top: 13mm;
      margin-left: 1px;
      margin-right: 1px;
      size: short;
    }
    @media print {
      html, body {
        width: 250mm;
        height: 297mm;
      }
      /* ... the rest of the rules ... */
    }   

Answer 1

根据您的图片，我想您可以尝试page-break-before或page-break-after

@media print {
    h1 {
        page-break-before: auto | always | avoid | left | right | inherit;
        page-break-after:  auto | always | avoid | left | right | inherit;
    }
}

有两篇文章可能会解释这两个CSS属性， 请单击此处 ， 然后单击此处

如果您可以在Fiddler上提供一些代码或示例，那么其他人可以帮助您