在每页中打印标题

Question

我已经完成了创建报告,下一步是创建一个将在每个页面中打印的标题.我尝试使用如何使用HTML在文档的每个打印页面上打印页眉和页脚的解决方案？ - 但它们似乎在webkit浏览器上运行不正常.

您是否知道在我的报告中实施此选项？

Answer 1

如果使用div标签,则在每个页面上打印页眉和页脚都是非常困难的任务.在我的项目中,我搜索了几乎完整的网页,发现每页打印页眉和页脚都必须使用表格和CSS规则,而不使用表格和CSS,你不能在每个页面上打印标题.我正在为您提供以下代码:

<style>
    @media screen{thead{display:none;}}
    @media print{thead{display:table-header-group; margin-bottom:2px;}}
    @page{margin-top:1cm;margin-left:1cm;margin-right:1cm;margin-bottom:1.5cm;}}
</style>

第一个CSS规则使得表格的不会在用户的屏幕上显示,第二个规则定义在打印期间,thead显示为table-header-group,因为如果省略此标题,此规则将在每个页面上显示标题在每个页面上打印,第三个规则是用于保持页边距不重叠页眉或页脚,你的html代码如下:

<table>
    <thead>
        <tr>
            <th>  <---  Your header text would be placed here    --->  </th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <--- Your printing text would be place here    ---> 
            </td>
        </tr>
    </tbody>
</table>

最后,我在IE,Safari,Firefox和Chrome上试过了一些东西代码,并且想告诉你,在Chrome上,标题只在第一页打印.我也多次报告过该错误,但Chrome没有对此问题做任何处理.