Mengapa CSS2.1 Menggunakan `overflow` Selain daripada 'kelihatan' untuk Mencipta Konteks Pemformatan Sekat?

Mengapa CSS2.1 Mewajibkan Nilai Limpahan Selain "Kelihatan" untuk Mewujudkan Konteks Pemformatan Blok Baharu?

Dalam CSS2.1, nilai limpahan selain daripada "kelihatan" ditentukan untuk mencipta "konteks pemformatan blok" baharu. Keputusan ini telah menimbulkan persoalan tentang rasional di sebalik menggabungkan dua ciri yang kelihatan tidak berkaitan: penciptaan konteks pemformatan blok (BFC) dan penindasan limpahan.

Konteks Sejarah dan Pertimbangan Utama

Menurut pertanyaan yang dibuat pada senarai mel CSS, keputusan ini berpunca daripada keperluan untuk menangani tatal dalam kotak yang bersilang dengan terapung. Spesifikasi CSS 2.0 asal memerlukan penyemak imbas untuk membalut semula kandungan di sekeliling terapung yang menceroboh semasa menatal, menyebabkan isu prestasi.

Pindaan CSS2.1 menghalang pembungkusan semula ini dengan mewujudkan BFC baharu untuk nilai limpahan selain daripada "kelihatan". Ini memastikan bahawa:

• Kandungan dalam BFC baharu tidak terjejas oleh terapung.
• Tingkah laku menatal BFC tidak terjejas oleh kehadiran terapung.

Contoh

Pertimbangkan perkara berikut contoh:

<div>...</div>
<div>
  ...:
  ...:
</div>

div {
  height: 80px;
}

div:first-child:before {
  float: left;
  height: 100px;
  margin: 10px;
  content: 'Float';
}

Dalam CSS 2.0, dengan limpahan: boleh dilihat (lalai), kotak kedua bertindih dengan elemen terapung. Walau bagaimanapun, dengan limpahan: auto (CSS 2.1), kotak kedua memperoleh BFC baharu, menghalang apungan daripada bersilang kandungannya.

Implikasi Limpahan: Tersembunyi

Walaupun limpahan: tersembunyi biasanya menyembunyikan kandungan limpahan, ia masih membenarkan penatalan terprogram. Ini penting kerana kotak dengan limpahan: tersembunyi yang mengandungi apungan bersilang mesti mewujudkan BFC baharu untuk mengelakkan pembalut semula semasa menatal.

Perubahan Diperkenalkan dalam CSS2.1

CSS2 .1 memperkenalkan perubahan tambahan:

• Sekat pemformatan elemen akar konteks (elemen dengan nilai limpahan selain daripada "kelihatan") kini meregang secara menegak ke ketinggian terapungnya.
• Kotak dengan limpahan: tersembunyi dan ketinggian: auto dihadkan oleh sempadan bekasnya dan tidak lagi boleh bersilang terapung.

Ketekalan dan Prestasi

Akhirnya, keputusan untuk mencipta BFC baharu untuk nilai limpahan selain daripada "kelihatan" terutamanya didorong oleh pertimbangan prestasi dan keinginan untuk konsisten dalam mengendalikan kandungan yang melimpah. Pendekatan ini mengoptimumkan prestasi menatal dan mengekalkan reka letak yang boleh diramal.

Atas ialah kandungan terperinci Mengapa CSS2.1 Menggunakan `overflow` Selain daripada 'kelihatan' untuk Mencipta Konteks Pemformatan Sekat?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!