将HTML文档格式化为多个A4大小的节

将HTML文档格式化为多个A4大小的节,html,css,printing,Html,Css,Printing,这是我目前的问题 我想生成一个HTML页面,其中包含大约40张优惠券。每张优惠券必须有一个A4大小的部分 因此,如果我要打印HTML文档,我希望每个打印页面包含1张优惠券 关于如何实现这一点的想法?使用HTML永远无法获得非常精确的解决方案,因为每个浏览器都决定以最佳方式打印HTML,并添加各种页眉和页脚,这些页眉和页脚会改变页面尺寸以及客户端打印机实际打印的方式 您最好生成一个优惠券的PDF,这样您就可以轻松地使用PHP扩展了。下面的CSS应该可以满足您的需要,为适合您的DOM结构的任何内容设

这是我目前的问题

我想生成一个HTML页面,其中包含大约40张优惠券。每张优惠券必须有一个A4大小的部分

因此,如果我要打印HTML文档,我希望每个打印页面包含1张优惠券


关于如何实现这一点的想法?

使用HTML永远无法获得非常精确的解决方案,因为每个浏览器都决定以最佳方式打印HTML,并添加各种页眉和页脚,这些页眉和页脚会改变页面尺寸以及客户端打印机实际打印的方式


您最好生成一个优惠券的PDF,这样您就可以轻松地使用PHP扩展了。

下面的CSS应该可以满足您的需要,为适合您的DOM结构的任何内容设置类名

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

这将始终在元素之后插入分页符。您也可以使用
分页符在元素之前实现分页符。

您可以执行以下步骤:

  • 在css样式中为每个优惠券定义
    宽度:100
    。这将使用纸张的最大宽度
  • 在每个优惠券的css属性中使用
    分页符:始终
    。这将迫使下一张优惠券显示在下一页。(http://msdn.microsoft.com/en-us/library/ms530842(v=vs.85).aspx)
  • 别忘了小心你的优惠券高度。尽量避免在其中放太多行。

    您可以为每个优惠券使用
    标记,并在其上应用css属性。

    您是否尝试将a4类的divs与css
    div.a4{宽度:210mm;高度:297mm;}
    ?大小帮助解决了我的问题。这是错误的,CSS2+包含了非常受支持的分页符前后属性,结合印刷媒体查询,您实际上可以实现相当可靠的打印样式,您唯一无法计算的是用户的打印边距,但如果您只需要计算一个分页符,那么就可以通过CSS轻松实现。我现在不知道,但上一次我尝试使用
    分页符后:始终
    ,它在Chrome和Safari中根本不起作用。我对印刷媒体查询的经验是,仅将其用于去除样式。我同意,随着我的发展,我将不得不使用PDF作为解决方案。这正是我手头的问题所需要的。你的意思是
    宽度:100%