首页 >web前端 >css教程 >如何在 Google Chrome 打印中可靠地强制分页？

如何在 Google Chrome 打印中可靠地强制分页？

Patricia Arquette原创: 2024-12-10 02:29:12924浏览

How Can I Reliably Force Page Breaks in Google Chrome Printing?

Google Chrome 打印中的分页符

尽管有相反的说法，但“page-break-after：always;” CSS 属性通常无法在 Google Chrome 中强制分页。为了解决这个问题，请考虑采用一种更强大的方法，该方法已被证明在包括 Chrome 在内的所有主要浏览器中都有效。

建议的解决方案涉及创建一个自定义打印媒体 CSS 规则，该规则利用“page”类来控制页面休息。以下代码片段说明了这种方法：

<!DOCTYPE html>

<html>
  <head>
    <meta http-equiv="content-type" content="text/html;charset=UTF-8" />
    <title>Paginated HTML</title>
    <style type="text/css" media="print">
      div.page {
        page-break-after: always;
        page-break-inside: avoid;
      }
    </style>
  </head>
  <body>
    <div class="page">
      <h1>This is Page 1</h1>
    </div>
    <div class="page">
      <h1>This is Page 2</h1>
    </div>
    <div class="page">
      <h1>This is Page 3</h1>
    </div>
  </body>
</html>

通过利用“page”类，此方法可确保对文档中的分页符进行精确控制。 “page”div 的每个实例都代表一个单独的页面，从而在打印时产生可靠的分页符。此解决方案对于分页文档特别有用，其中每个页面应包含特定元素。

以上是如何在 Google Chrome 打印中可靠地强制分页？的详细内容。更多信息请关注PHP中文网其他相关文章！

css chrome print for break class Property this issue

声明：

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn

上一篇：How to Prevent Absolute Elements from Overlapping in CSS?下一篇：How to Vertically Align Text with Large Font Awesome Icons in Bootstrap Buttons?

查看更多