html – 在所有页面上打印页眉/页脚(打印模式)

发布时间：2020-12-14 21:49:50 所属栏目：资源来源：网络整理

导读：div id="header"header/divdiv id="content" content spanning several pages.../divdiv id="footer"Footer - Fixed at the bottom of each page/div 我想在打印模式下在每个页面上打印#header和#footer。我搜了很多，但没有什么似乎工作，甚至位置：固定不

<div id="header">header</div>
<div id="content">
    content spanning several pages...
</div>
<div id="footer">Footer - Fixed at the bottom of each page</div>

我想在打印模式下在每个页面上打印#header和#footer。我搜了很多，但没有什么似乎工作，甚至位置：固定不按预期工作。

我真的很感谢任何帮助。

谢谢！

解决方法

如果您愿意切换到表格(不一定是理想的)，您可以使用< aad>和< tfoot>元素。他们将打印在每页的顶部和底部：

<table>

  <thead>
     <!-- Will print at the top of every page -->
  </thead>

  <tbody>
     <!-- Page content -->
  </tbody>

  <tfoot>
     <!-- Will print at the bottom of every page -->
  </tfoot>

</table>

另一个选择是使用display table-header-group和table-footer-group，但跨浏览器的支持并不是很大：

#header {
  display: table-header-group;
}

#main {
  display: table-row-group;
}

#footer {
  display: table-footer-group;
}

（编辑：李大同）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!