Bagaimana Mengekalkan Pengepala Meja Tetap Semasa Menatal Badan Meja?

Membetulkan Pengepala Jadual dengan Badan Tatal

Mengekalkan pengepala jadual tetap sambil membenarkan badan menatal adalah keperluan biasa dalam pembangunan web. Untuk mencapai matlamat ini, gunakan pendekatan berikut:

1. Balut Kandungan Jadual dalam Dua Elemen Bersarang:

• Buat elemen jadual luar (cth., #mainTable) untuk menampung keseluruhan jadual.
• Buat elemen jadual dalam (cth. , #innerTable) untuk mengandungi badan jadual yang perlu tatal.

2. Tetapkan Ketinggian Jadual Luar:

• Gunakan ketinggian tetap pada jadual luar menggunakan CSS (cth., #mainTable { height: 500px; }).

3. Kedudukan Jadual Dalam:

• Letakkan jadual dalam secara mutlak dalam jadual luar menggunakan CSS (cth., #innerTable { position: absolute; atas: 0; bawah: 0; lebar: 100%; }).

4. Betulkan Pengepala:

• Gunakan kedudukan: melekit; ke baris pengepala jadual dalam (cth., #innerTable th { position: sticky; top: 0; }).

5. Dayakan Tatal:

• Pastikan ketinggian jadual dalam melebihi ketinggian jadual luar, mencetuskan limpahan menegak.
• Dayakan tatal pada jadual dalam menggunakan CSS (cth., #innerTable { limpahan: auto; }).

Contoh:

<div>

Atas ialah kandungan terperinci Bagaimana Mengekalkan Pengepala Meja Tetap Semasa Menatal Badan Meja?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!