Rumah >hujung hadapan web >tutorial css >Mengapa Peratusan Ketinggian dalam CSS Berkelakuan Berbeza Daripada Peratusan Lebar?

Mengapa Peratusan Ketinggian dalam CSS Berkelakuan Berbeza Daripada Peratusan Lebar?

Linda Hamilton
Linda Hamiltonasal
2024-12-22 07:21:36239semak imbas

Why Do Percentage Heights in CSS Behave Differently Than Percentage Widths?

Mengapa Peratusan Tinggi Berbeza daripada Lebar dalam CSS

Soalan: Walaupun penerapan nilai peratusan yang berjaya untuk lebar, mengapa peratusan ketinggian gagal mencapai kesan yang sama?

Jawapan: perbezaan asas terletak pada kelakuan lalai elemen blok. Ketinggian unsur-unsur ini sememangnya menyesuaikan diri dengan kandungan yang disertakan. pertimbangkan contoh berikut:

<div>

Di sini, #inner akan mengembang secara menegak untuk menampung teks dalam

dan #outer akan melaraskan ketinggiannya untuk mengandungi #inner.

Apabila menentukan peratusan ketinggian atau lebar, ia merujuk kepada elemen induk. Untuk lebar, elemen blok biasanya menjangkau lebar penuh induknya, menjadikan hasilnya boleh diramal. Lebar tetapan: 50% diterjemahkan kepada lebar piksel tertentu.

Walau bagaimanapun, ketinggian berbeza kerana ketinggian elemen blok ditentukan oleh kandungan. Menetapkan ketinggian: 50% adalah samar-samar tanpa mentakrifkan ketinggian elemen induk secara eksplisit. Gelung maklum balas antara elemen ibu bapa dan anak ini mewujudkan ketidakpastian dalam menentukan ketinggian akhir. Untuk memecahkan kitaran ini, elemen induk mesti mempunyai ketinggian yang ditentukan.

Atas ialah kandungan terperinci Mengapa Peratusan Ketinggian dalam CSS Berkelakuan Berbeza Daripada Peratusan Lebar?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn