搜索

首页  >  问答  >  正文

当我打印长 html 表格时,需要帮助在每个页面上添加页眉和页脚

我有一个带有长 HTML 表格的视图。当我尝试打印该视图时,该表被分成几页。显然,表格会中断并继续到下一页,依此类推。我希望能够在每个打印页面上整齐地添加页眉和页脚。

我尝试过使用 css 分页符属性,例如:

内部分页符 分页后 分页前<​​/p>

我尝试使用位置:固定将页眉和页脚固定到顶部和底部。即使页脚显示在每个页面上,它也会与表格重叠。正如您在突出显示区域中看到的那样:

所以我想显示页眉和页脚,没有任何重叠。

桌子就是这样折断的^^

我希望每个页面上都显示页眉和页脚。我尝试在 thead 和 tfoot 标记中添加页眉和页脚,但这不起作用。

我尝试过使用 css 分页符属性,例如:

内部分页符 分页后 分页前<​​/p>

我尝试使用位置:固定将页眉和页脚固定到顶部和底部。即使页脚显示在每个页面上,它也会与表格重叠。正如您在突出显示区域中看到的那样:

P粉662802882P粉662802882351 天前520

全部回复(1)我来回复

  • P粉744831602

    P粉7448316022023-12-19 12:06:13

    这是解决我的问题的代码:

    HTML

    <table>
      <thead><tr><td>
        <div class="header-space">&nbsp;</div>
      </td></tr></thead>
      <tbody><tr><td>
        <div class="content">...</div>
      </td></tr></tbody>
      <tfoot><tr><td>
        <div class="footer-space">&nbsp;</div>
      </td></tr></tfoot>
    </table>
    <div class="header">...</div>
    <div class="footer">...</div>

    CSS

    .header, .header-space,
    .footer, .footer-space {
      height: 100px;
    }
    .header {
      position: fixed;
      top: 0;
    }
    .footer {
      position: fixed;
      bottom: 0;
    }
    

    回复
    0
  • 取消回复