我正在制作一个HTML报告,将是可打印的,它有“部分”,应该在一个新的页面开始。

有没有办法在HTML/CSS中放入一些东西,将向浏览器发出信号,它需要在此时强制换页(开始一个新页面)?

我不需要它在每个浏览器中都能运行,我想我可以告诉人们使用特定的浏览器来打印它。


当前回答

例如: 下面的代码出现在页面的末尾,你想强制HTML打印在另一个页面上,这样你就可以这样编码

       <table>
            <tbody>
               <tr>
                  <td width="180" valign="top">
                            <p>
                                <strong> </strong>
                            </p>
                            <p>
                                <strong> </strong>
                            </p>
                            <p>
                                <strong> </strong>
                            </p>
                            <p>
                                <strong> </strong>
                            </p>
                            <p align="center">
                                <strong>Approved by Director</strong>
                            </p>
                        </td>
                    </tr>
                </tbody>
            </table>

主要代码在这里:期望的答案

<div style="page-break-inside:avoid;page-break-after:always"></div>

现在像这样编写第二页/另一页的其余代码

                <table border="1">
                            <tr class="center">
                                <td>
                                    #Main<b>&nbsp;Main</b>
                                </td>
                                <td>
                                    #Project<b>&nbsp;Project</b>
                                </td>
                                <td>
                                    #TypeMainProj<b>&nbsp;Main + Project</b>
                                </td>
                                <td>
                                    #Imprest<b>&nbsp;Imprest</b>
                                </td>
                            </tr>
                        </table>

其他回答

克里斯·道格特说得很有道理。 不过,我在lvsys.com上发现了一个有趣的技巧,它实际上在firefox和chrome上都有效。只需将此注释放在您希望插入换行符的任何位置。您还可以将<p>标记替换为任何块元素。

<p><!-- pagebreak --></p>

第一页(向下滚动查看第二页) < div风格= "后休息:页面" > < / div > 第二个页面 < br > < br > <button onclick="window.print();return false;"/>打印(查看结果)</button> .

只要在你需要进入下一页的地方添加这个(文本“page 1”将在第1页,文本“page 2”将在第二页)。

Page 1
<div style='break-after:always'></div>
Page 2

这也是可行的:

First page (there is a break after this)
<div style="break-after:page"></div>
Second page (This will be printed in the second page)

试试这个(它在Chrome, Firefox和IE中都有效):

... content in page 1 ...
<p style="page-break-after: always;">&nbsp;</p>
<p style="page-break-before: always;">&nbsp;</p>
... content in page 2 ...

您可以使用CSS属性page-break-before(或page-break-after)。只需要设置page-break-before:总是在那些块级别的元素(例如,标题,div, p,或表元素)上,这些元素应该以新行开始。

例如,要在任何第2级标题之前和类newpage中的任何元素之前引起换行(例如,<div class=newpage>…),您可以使用

h2, .newpage { page-break-before: always }

CSS

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

HTML

<div class="pagebreak"></div>