我正在制作一个HTML报告,将是可打印的,它有“部分”,应该在一个新的页面开始。
有没有办法在HTML/CSS中放入一些东西,将向浏览器发出信号,它需要在此时强制换页(开始一个新页面)?
我不需要它在每个浏览器中都能运行,我想我可以告诉人们使用特定的浏览器来打印它。
我正在制作一个HTML报告,将是可打印的,它有“部分”,应该在一个新的页面开始。
有没有办法在HTML/CSS中放入一些东西,将向浏览器发出信号,它需要在此时强制换页(开始一个新页面)?
我不需要它在每个浏览器中都能运行,我想我可以告诉人们使用特定的浏览器来打印它。
当前回答
试试这个链接
<style>
@media print
{
h1 {page-break-before:always}
}
</style>
其他回答
添加一个CSS类“pagebreak”(或“pb”),如下所示:
@media print {
.pagebreak { page-break-before: always; } /* page-break-after works, as well */
}
然后在需要分页符的位置添加一个空DIV标记(或生成方框的任何块元素)。
<div class="pagebreak"> </div>
它不会显示在页面上,但在打印时将页面分开。
附注:也许这只适用于使用-after时(也适用于你可能对页面上的其他<div>做什么),但我发现我必须增加CSS类如下:
@media print {
.pagebreak {
clear: both;
page-break-after: always;
}
}
中引入分页符的位置,可以添加样式为“page-break-after: always”的分页符标记 html页面。 “page-break-before”也可以
例子:
HTML_BLOCK_1
<p style="page-break-after: always"></p>
HTML_BLOCK_2
<p style="page-break-after: always"></p>
HTML_BLOCK_3
当用上面的代码打印html文件时,打印预览将显示三个页面(每个html块“HTML_BLOCK_n”),在浏览器中,所有三个块依次出现。
试试这个(它在Chrome, Firefox和IE中都有效):
... content in page 1 ...
<p style="page-break-after: always;"> </p>
<p style="page-break-before: always;"> </p>
... content in page 2 ...
CSS
@media print {
.pagebreak {
page-break-before: always;
}
}
HTML
<div class="pagebreak"></div>
例如: 下面的代码出现在页面的末尾,你想强制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> Main</b>
</td>
<td>
#Project<b> Project</b>
</td>
<td>
#TypeMainProj<b> Main + Project</b>
</td>
<td>
#Imprest<b> Imprest</b>
</td>
</tr>
</table>