Bolehkah CSS Grid Meletakkan Cucu Secara Terus, dan Bagaimana?

Grid CSS: Bolehkah Anda Meletakkan "Cucu" pada Grid?

Banyak panduan grid CSS membayangkan struktur di mana elemen kedudukan grid berada kanak-kanak langsung unsur grid. Walau bagaimanapun, ia mungkin timbul apabila anda perlu meletakkan elemen "cucu" terus pada grid itu sendiri.

Keperluan untuk "Subgrid"

Dalam senario bersarang dengan grid datuk nenek, bekas ibu bapa dan elemen cucu, anda mungkin mahu meletakkan setiap cucu pada barisnya dalam grid. Adakah ini masuk akal dalam terminologi grid?

Masukkan: paparan: subgrid

Daripada spesifikasi draf Grid CSS Tahap 2, kami memperkenalkan konsep paparan: subgrid. Digunakan pada item grid, paparan: subgrid membenarkan anak item mewarisi reka letak grid bekas sambil mengabaikan sifat grid item.

Ciri ini belum lagi dilaksanakan secara meluas dalam penyemak imbas. Walau bagaimanapun, ia menawarkan penyelesaian yang berpotensi untuk masalah kedudukan "cucu".

Alternatif Untuk Sekarang

Sementara menunggu sokongan untuk paparan: subgrid, pendekatan alternatif wujud:

• Gunakan paparan: grid pada item grid (walaupun pengehadan wujud).
• Gunakan paparan: kandungan untuk mewarisi garis grid secara menegak.

Sumber Tambahan

• [Apakah itu CSS paparan: subgrid?](https://developer.mozilla.org/en-US/docs/Glossary/display)
• [Subgrids dalam CSS Grid Tahap 2](https://blogs.igalia.com/mrego /2016/02/12/subgrids-thinking-out-loud/)
• [paparan: subgrid untuk menjajarkan item pada bekas cucu](https://bugzilla.mozilla.org/show_bug.cgi?id=1240834)

Atas ialah kandungan terperinci Bolehkah CSS Grid Meletakkan Cucu Secara Terus, dan Bagaimana?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!