Bagaimanakah Limpahan Mempengaruhi Kedudukan Melekit dalam Modul Reka Letak Kedudukan Kedudukan CSS Tahap 3?

Kotak Menatal dalam Modul Reka Letak Kedudukan CSS Tahap 3

Modul Reka Letak Kedudukan Kedudukan CSS Tahap 3 mentakrifkan kedudukan melekit, yang serupa dengan tingkah laku daripada kotak yang agak kedudukannya. Walau bagaimanapun, pengimbangan dikira berkenaan dengan nenek moyang terdekat dengan kotak tatal, atau port pandangan jika tiada nenek moyang mempunyai kotak tatal.

Apakah yang Layak sebagai Kotak Tatal?

Kotak menatal ialah kotak yang nilai limpahan ditetapkan kepada nilai selain daripada yang boleh dilihat (lalai). Ini berdasarkan dokumentasi sebelum ini di mana isu dengan unsur melekit timbul akibat limpahan.

Kesan Limpahan pada Kedudukan Melekit

Jika elemen dengan limpahan: tersembunyi ialah nenek moyang daripada kedudukan: elemen melekit, offset yang terakhir akan dikira berdasarkan kotak nenek moyang dengan limpahan tersembunyi. Akibatnya, kelakuan menatal akan dihadkan, menghalang unsur melekit daripada kelihatan.

Contoh Kod

.wrapper {
  height:200vh;
  border:2px solid;
}
.wrapper >div {
  position:sticky;
  top:0;
  height:20px;
  background:red;
}

<div class="wrapper">
  <div></div>
</div>

Atas ialah kandungan terperinci Bagaimanakah Limpahan Mempengaruhi Kedudukan Melekit dalam Modul Reka Letak Kedudukan Kedudukan CSS Tahap 3?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!