含大表格的HTML页面打印时,如何让footer显示在每一页最底部?
我有一个包含大表格的HTML页面,打印时希望footer能显示在每一页的最底部,但尚未找到100%可行的解决方案。
已尝试的方案及存在的问题
1. 使用tfoot
该方案能让footer在除最后一页外的每页底部显示,但最后一页不生效,示例如下:
- tfoot示例1:

- tfoot示例2:

2. 使用position: fixed
该方案能让footer在每页底部显示,但会遮挡页面内表格的最后一行,示例如下:
- 固定定位示例1:

- 固定定位示例2:

当前使用的样式代码
thead{ display: table-header-group; } tfoot{ display: table-footer-group; } tr,td{ border: 1px solid; page-break-inside: avoid; } .footer{ position: fixed; bottom: 0; text-align:center; width: 100%; padding-top: 10px; } @media print { tr { page-break-inside: avoid; } }
恳请各位帮忙解决上述任一问题,或提供未发现的可行方案。
内容的提问来源于stack exchange,提问作者Omar
相关产品推荐
相关产品推荐

