Apakah itu ` kandungan min` dan ` kandungan maksimum` dalam Saiz Intrinsik CSS?

Saiz Intrinsik: Memahami kandungan min dan kandungan maksimum

Saiz CSS tahap 3 memperkenalkan konsep dimensi intrinsik, yang dikira berdasarkan kandungan dalam kotak bukannya induknya. kandungan min dan kandungan maks ialah sifat intrinsik yang menentukan dimensi minimum dan maksimum kotak, masing-masing.

Dimensi Intrinsik lwn Dimensi Ekstrinsik

Dimensi ekstrinsik kotak berasal daripada dimensi kotak induknya, seperti lebar: 80%. Sebaliknya, dimensi intrinsik, seperti lebar: kandungan min, ditentukan oleh kandungan dalam kotak itu sendiri.

Menentukan kandungan min dan kandungan maksimum

kandungan min. :

• Lebar terkecil yang mungkin bagi kotak yang mengelakkan kandungan limpahan.
• Jika kandungan kotak lebih sempit, limpahan akan berlaku.

kandungan maksimum:

• Yang "ideal " lebar kotak dengan ruang tersedia tanpa had.
• Kotak mengembang untuk menampung sepenuhnya kandungannya tanpa ruang kosong yang tidak perlu.

Bagaimanakah kandungan min dan kandungan maks Dikira?

Untuk menggambarkan kandungan min, pertimbangkan kotak terapung (mis., #red) dalam kotak mengandungi lebih luas (cth., #blue):

#blue { width: 0px; }
#red { float: left; }

Lebar kandungan min daripada #merah bersamaan dengan lebarnya apabila lebar #biru ialah 0px, memastikan kandungan #merah tidak melimpah.

Begitu juga, untuk kandungan maksimum, bayangkan #merah terapung dalam #biru yang sangat lebar:

#blue { width: 99999999999999999px; } /* ~infinite */

Lebar kandungan maksimum #merah sama dengan lebarnya apabila #biru lebar adalah tidak terhingga dengan berkesan, membolehkan kandungan #red berkembang sepenuhnya.

Sifat Intrinsik Tambahan

Sifat intrinsik lain sedang dibangunkan, termasuk kandungan fit dan regangan. Nantikan kemas kini masa hadapan tentang definisi dan pelaksanaan akhir mereka.

Atas ialah kandungan terperinci Apakah itu ` kandungan min` dan ` kandungan maksimum` dalam Saiz Intrinsik CSS?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!