## 表格可以解决打印页面上重复页眉和页脚的挑战吗？-css教程-PHP中文网

在多个打印页面上实现页眉和页脚重复

首页

web前端

css教程

## 表格可以解决打印页面上重复页眉和页脚的挑战吗？

Linda Hamilton

Oct 26, 2024 am 04:08 AM

## Can Tables Solve the Challenge of Repeating Headers and Footers on Printed Pages?

在多个打印页面上实现页眉和页脚重复

简介：

在生成的打印文档上保持页眉和页脚的一致性从网页中获取信息可能是一个令人困惑的挑战。尽管进行了广泛的研究，但许多解决方案仍然难以捉摸。然而，本文试图澄清并解决这个问题。

可以在每个页面上打印页眉和页脚吗？

根据您的查询，出现了问题：是是否可以在多个打印页面上重复自定义页眉和页脚？虽然您表示怀疑，但探索此类解决方案的潜力是有意义的。

解决问题：

您已经准确地得出结论，CSS 媒体类型可能不适合在这种情况下的主要障碍。相反，您研究了使用表格和表头标签的可能性。然而，让我们更深入地研究这种方法。

解决方案：

尽管表格在布局设计中存在明显的缺陷，但事实证明它是一个有效的解决方案案件。通过设置以下 CSS 样式，您可以实现所需的重复：

thead { display: table-header-group; }
tfoot { display: table-footer-group; }

登录后复制

随后，在渲染 HTML 时，确保按如下方式构造正文：

<body>
<table>
   <thead><tr><td>Your header goes here</td></tr></thead>
   <tfoot><tr><td>Your footer goes here</td></tr></tfoot>
   <tbody>
     <tr><td>
     Page body in here -- as long as it needs to be
     </td></tr>
   </tbody>
</table>
</body>

登录后复制

确保页眉和页脚仅在打印时出现，请使用以下 @media 参数：

@media print {
    thead { display: table-header-group; }
    tfoot { display: table-footer-group; }
}
@media screen {
    thead { display: none; }
    tfoot { display: none; }
}

登录后复制

浏览器兼容性：

此方法最初在 Firefox 和 IE 中起作用。不过，现在 Chrome 中也已经解决了这个问题。因此，Chrome 问题跟踪器中的上述错误可能被认为是过时的。

以上是## 表格可以解决打印页面上重复页眉和页脚的挑战吗？的详细内容。更多信息请关注PHP中文网其他相关文章！

本站声明

本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系admin@php.cn