Perlu bantuan menambah pengepala dan pengaki pada setiap halaman apabila saya mencetak jadual html yang panjang

Question

Saya mempunyai pandangan dengan jadual HTML yang panjang. Apabila saya cuba mencetak paparan, jadual dibahagikan kepada halaman. Jelas sekali borang itu pecah dan terus ke halaman seterusnya dan seterusnya. Saya mahu dapat menambah pengepala dan pengaki dengan kemas pada setiap halaman yang dicetak.

Saya telah mencuba menggunakan ciri css page break seperti:

Pecah halaman dalaman Selepas paging Sebelum penomboran <​​/p>

Saya cuba membetulkan pengepala dan pengaki ke atas dan bawah menggunakan position:fixed. Walaupun pengaki muncul pada setiap halaman, ia bertindih dengan jadual. Seperti yang anda boleh lihat di kawasan yang diserlahkan:

Jadi saya ingin menunjukkan pengepala dan pengaki tanpa sebarang pertindihan.

Beginilah pecah meja^^

Saya mahu pengepala dan pengaki muncul pada setiap halaman. Saya cuba menambah pengepala dan pengaki dalam teg thead dan tfoot tetapi itu tidak berfungsi.

Saya telah mencuba menggunakan ciri css page break seperti:

Pecah halaman dalaman Selepas paging Sebelum penomboran <​​/p>

Saya cuba membetulkan pengepala dan pengaki ke atas dan bawah menggunakan position:fixed. Walaupun pengaki muncul pada setiap halaman, ia bertindih dengan jadual. Seperti yang anda boleh lihat di kawasan yang diserlahkan:

Answer 1

Ini adalah kod yang menyelesaikan masalah saya:

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;
}