Align-Items vs. Align-Content: Bilakah \'-Content\' Sebenarnya Penting?

Membezakan Jajaran-Item lwn. Jajar-Kandungan dalam Susun Letak Grid

Apabila bekerja dengan Susun Letak Grid, fahami perbezaan antara "justify/align -item" dan "justify/align-content" adalah penting. Artikel ini bertujuan untuk menjelaskan perbezaan mereka, terutamanya mengenai dakwaan bahawa sifat "-kandungan" wujud disebabkan senario di mana saiz grid lebih kecil daripada bekas.

Mentakrifkan Terminologi

• Bekas Grid: Bekas induk bagi kedua-dua item grid dan grid, mewujudkan konteks pemformatan grid.
• Grid: Menyilang garis menegak dan mendatar membahagikan bekas kepada kawasan grid yang mengandungi item grid.
• Item Grid: Kotak kandungan dalam aliran dalam bekas grid.

Sejajarkan-Kandungan lwn. Jajar-Item

• Jajar-Kandungan: Jajarkan grid dalam bekas.
• Jajarkan-Item: Menjajarkan item grid dalam grid.

Menjelaskan Harta "-Kandungan"

Tuntutan bahawa sifat "-kandungan" wujud semata-mata kerana grid mungkin lebih kecil daripada bekas adalah mengelirukan. Dalam ilustrasi yang disediakan, grid sememangnya lebih kecil, membenarkan ruang untuk menjajarkan-kandungan untuk memusatkan grid secara menegak dan mewajarkan-kandungan untuk menjajarkannya ke kanan. Walau bagaimanapun, sifat ini masih terpakai apabila saiz grid sama dengan saiz bekas, walaupun tanpa sebarang kesan visual kerana ketiadaan ruang tambahan.

Ringkasan Spesifikasi

• justify-self/justify-item: Penjajaran paksi sebaris untuk grid item.
• align-self/align-item: Sekat penjajaran paksi untuk item grid.
• justify-content/align-content: Grid penjajaran dalam bekas apabila tepi luarnya tidak sejajar dengan tepi kandungan bekas.

Atas ialah kandungan terperinci Align-Items vs. Align-Content: Bilakah '-Content' Sebenarnya Penting?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!