Bila hendak menggunakan `height: 100%` lwn. `min-height: 100%` dalam CSS?

tinggi:100% lwn. ketinggian min:100%

Apabila cuba mengawal ketinggian elemen HTML, CSS menawarkan dua sifat penting: ketinggian dan ketinggian min. Sifat ini memainkan peranan yang berbeza dalam menentukan saiz elemen.

tinggi:100%

Menetapkan ketinggian kepada 100% menunjukkan bahawa elemen harus mengembang untuk menduduki keseluruhan ketinggian bekas induknya. Ini bermakna ketinggian elemen akan melaraskan secara dinamik berdasarkan saiz induknya.

tinggi min:100%

Sebaliknya, ketinggian min menentukan ketinggian minimum untuk sesuatu elemen. Jika ketinggian pengiraan elemen, dengan mengambil kira faktor lain seperti kandungan dan margin, adalah kurang daripada 100%, ketinggian min menguatkuasakan ketinggian 100%. Walau bagaimanapun, jika ketinggian yang dikira melebihi 100%, ketinggian min tidak mempunyai kesan.

Perbezaan Utama

Perbezaan utama antara ketinggian:100% dan ketinggian min: 100% terletak pada tingkah laku mereka apabila ketinggian pengiraan unsur kurang daripada 100%. Ketinggian:100% membolehkan elemen mengecut di bawah 100%, manakala ketinggian min:100% menghalang pengecutan ini dengan mengenakan ketinggian minimum 100%.

Contoh

Jika anda mempunyai

dengan ketinggian:100% dan tiada ketinggian min yang jelas, ia akan memenuhi keseluruhan ketinggian bekas induknya. Sebaliknya, jika anda menentukan ketinggian min:100% untuk

yang sama, ia tidak akan pernah lebih kecil daripada 100% ketinggian bekas induknya, tanpa mengira kandungan atau jidarnya.

Atas ialah kandungan terperinci Bila hendak menggunakan `height: 100%` lwn. `min-height: 100%` dalam CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

css less html if for while this

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

Artikel sebelumnya：Apakah Yang Benar-Benar Dilakukan Kata Kunci \"auto\" dalam Sifat CSS?Artikel seterusnya：Apakah Yang Benar-Benar Dilakukan Kata Kunci \"auto\" dalam Sifat CSS?

Artikel berkaitan

Lihat lagi

• Bagaimanakah saya boleh mencapai sudut bulat untuk keseluruhan jadual menggunakan CSS apabila jejari sempadan tidak boleh digunakan terus pada baris jadual?
• Mengapa iFrame Saya Tidak Berpusat Secara Mendatar, dan Bagaimana Saya Boleh Membetulkannya?
• Bagaimanakah saya boleh menggunakan gaya CSS responsif secara khusus pada peranti mudah alih tanpa menjejaskan pembentangan desktop?
• Bagaimana untuk Mencapai Susunan Lajur Responsif dalam Bootstrap 3 Menggunakan Kelas Tolak dan Tarik?
• Mengapa Lajur Bootstrap Tidak Dibalut Dengan Betul pada Saiz XS?