Sejauh manakah Konteks Pemformatan Grid CSS Mencapai?

Penghadan Skop Bekas Grid

Dalam Grid CSS, konteks pemformatan dihadkan kepada perhubungan induk-anak dalam bekas grid. Sifat grid hanya digunakan untuk anak langsungnya.

Pertimbangkan contoh berikut:

<ul>

Di sini, orgChartLevel1 ialah bekas grid dan orgChartLevel1a, orgChartLevel2 dan orgChartLevel2b ialah kanak-kanak dalam skopnya.

Walau bagaimanapun, elemen yang merupakan keturunan grid bekas, seperti orgChartLevel2b, berada di luar konteks pemformatan grid. Sifat grid yang digunakan pada elemen ini tidak akan berfungsi.

Penyelesaian

Untuk menggunakan sifat grid pada elemen bersarang dalam, anda mesti sama ada:

<ul>

Gunakan paparan: grid atau paparan: grid sebaris kepada induk dalam bekas grid.

Alih keluar sebarang elemen pembalut antara bekas grid dan elemen yang anda ingin gunakan sifat grid.

Nota

<ul>

Item grid juga boleh menjadi bekas grid.

Rujuk sumber tambahan di bawah untuk mendapatkan maklumat lanjut tentang flex dan grid bersarang bekas.

Bacaan Berkaitan:

<ul>

Letakkan elemen bersarang dalam dalam bekas grid peringkat lebih tinggi

Penggunaan sifat flex yang betul apabila bersarang bekas flex

Adakah amalan buruk untuk menyarang CSS Grid?

Atas ialah kandungan terperinci Sejauh manakah Konteks Pemformatan Grid CSS Mencapai?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!