Html Javascript在不同页面上打印多个div_Html_Css_Media Queries_Css Paged Media

Html Javascript在不同页面上打印多个div

html css

Html Javascript在不同页面上打印多个div,html,css,media-queries,css-paged-media,Html,Css,Media Queries,Css Paged Media,我需要在A4纸上打印，每个从不同的页面开始 //内容 //内容 //内容 ..在CSS中： #1 {page-break-after: always;} #2 {page-break-after: always;} #3 {page-break-after: always;} 其中#1是div的ID您可以使用以下css： div { page-break-after: always; } 属性设置是否在指定元素之后发生分页符阅读本文了解完整信息-不要使用JavaScript，使用C

我需要在A4纸上打印，每个

从不同的页面开始


//内容
//内容
//内容
..

在CSS中：

#1 {page-break-after: always;}
#2 {page-break-after: always;}
#3 {page-break-after: always;}

其中#1是div的ID

您可以使用以下css：

div {
  page-break-after: always;
}

属性设置是否在指定元素之后发生分页符

阅读本文了解完整信息-

不要使用JavaScript，使用CSS：

@media print {
  /* top-level divs with ids */
  body > div[id] {
    page-break-before: always;
  }
}

这将使用和确保在上查看（或打印）时，id为的非空

s将始终从新页面开始

将下面另存为HTML文件，并使用“打印”对话框在浏览器中打开它。您将看到每个

都从一个新页面开始：

<!DOCTYPE html>
<html>
<head>
  <style>
    @media print {
      /* top-level divs with ids */
      body > div[id] {
        page-break-before: always;
      }
    }
  </style>
</head>
<body>
  <div id="1">
    content
  </div>

  <div id="2">
    content
  </div>

  <div id="3">
    content
  </div>
</body>
</html>


@媒体印刷品{
/*具有ID的顶级div*/
body>div[id]{
前分页符：始终；
}
}
内容
内容
内容