HTML文档打印分页标记_HTML/CSS_西西优一点

html打印打印分页阅读：1005 时间：2023年03月10日

关于html文档打印，实现指定位置分页这个需求，以前是不知道如何处理了的。也不知道这个CSS属性是什么时候出现的。总之我是刚刚知道的。好久没有更新文章了，正好记录一下吧。代码很简单，只要一个CSS属性就可以了。 @media print{...

关于html文档打印，实现指定位置分页这个需求，以前是不知道如何处理了的。

也不知道这个CSS属性是什么时候出现的。总之我是刚刚知道的。好久没有更新文章了，正好记录一下吧。

代码很简单，只要一个CSS属性就可以了。

    @media print{
      .page{
        page-break-after: always;
      }
    }

在html文档里，选择器.page的元素结束处，都被视为分页。

  <div class="page">
    这是第一个分页
  </div>
  <div class="page">
    这是第二个分页
  </div>

然后顺着爬了一下，看了下page-break-after的文档。一起简单了解一下：

auto	默认。如果必要则在元素后插入分页符。
always	在元素后插入分页符。
avoid	避免在元素后插入分页符。
left	在元素之后足够的分页符，一直到一张空白的左页为止。
right	在元素之后足够的分页符，一直到一张空白的右页为止。
inherit	规定应该从父元素继承 page-break-after 属性的设置。