Bolehkah Pengepala Melekit Digunakan Dalam Div Tatal untuk Pengepala Jadual?

Tajuk Melekit Dalam Div Tatal

Kedudukan: melekit; hartanah telah mendapat daya tarikan dalam Webkit, membolehkan elemen kekal tetap dalam bekas induk mereka semasa menatal. Walau bagaimanapun, sesetengah pembangun telah menyatakan keperluan untuk melanjutkan fungsi ini kepada menatal elemen div yang mengandungi jadual.

Bolehkah kedudukan melekit digunakan pada pengepala jadual dalam div menatal?

Jawapan:

Memang, kedudukan: melekit; kini boleh digunakan untuk elemen mulai 2018!

Pelaksanaan:

Cuma tambah baris berikut pada lembaran gaya CSS anda:

<code class="css">thead th { position: sticky; top: 0; }</code>

Prasyarat:

• Pastikan jadual anda mengandungi dan elemen.

Contoh Penanda Jadual:

<code class="html"><table>
    <thead>
        <tr>
            <th>column 1</th>
            <th>column 2</th>
            <th>column 3</th>
            <th>column 4</th>            
        </tr>    
    </thead>
    <tbody>
      // body code
    </tbody>
</table></code>

Pilihan Tambahan:

• Untuk membetulkan baris pertama semasa menatal, gunakan yang berikut:

<code class="css">thead tr:first-child th { position: sticky; top: 0; }</code>

Sokongan Penyemak Imbas:

Sehingga Mac 2018, kedudukan melekit untuk elemen iklan disokong secara meluas merentas penyemak imbas moden , terima kasih atas usaha komuniti pembangun.

Atas ialah kandungan terperinci Bolehkah Pengepala Melekit Digunakan Dalam Div Tatal untuk Pengepala Jadual?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!