搜尋

首頁  >  問答  >  主體

當我列印長 html 表格時,需要協助在每個頁面上新增頁首和頁腳

我有一個長 HTML 表格的視圖。當我嘗試列印該視圖時,該表被分成幾頁。顯然,表格會中斷並繼續到下一頁,依此類推。我希望能夠在每個列印頁面上整齊地添加頁首和頁尾。

我嘗試過使用 css 分頁符號屬性,例如:

內部分頁符 分頁後 分頁前<​​/p>

我嘗試使用位置:固定將頁首和頁尾固定到頂部和底部。即使頁腳顯示在每個頁面上,它也會與表格重疊。正如您在突出顯示區域中看到的那樣:

所以我想顯示頁首和頁尾,沒有任何重疊。

桌子就是這樣折斷的^^

我希望每個頁面上都顯示頁首和頁尾。我嘗試在 thead 和 tfoot 標記中添加頁首和頁腳,但這不起作用。

我嘗試過使用 css 分頁符號屬性,例如:

內部分頁符 分頁後 分頁前<​​/p>

我嘗試使用位置:固定將頁首和頁尾固定到頂部和底部。即使頁腳顯示在每個頁面上,它也會與表格重疊。正如您在突出顯示區域中看到的那樣:

P粉662802882P粉662802882382 天前551

全部回覆(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
  • 取消回覆