CSS GridLesson 84Preview gratis
Grid Container
Lesson ini bagian dari CSS · Semua level
Ringkasan
Pelajaran ini membahas properti pada grid container, seperti perataan isi sel dengan `justify-items` dan `align-items`, penyebaran trek dengan `justify-content` dan `align-content`, serta pembagian area bernama memakai `grid-template-areas`. Pengaturan otomatis baris/kolom tambahan dilakukan oleh `grid-auto-flow` dan `grid-auto-rows`. Penguasaan properti kontainer membuat kerangka halaman sangat mudah disusun.
Poin kunci
- `grid-template-areas` memberi nama pada area grid agar penempatan sel lebih terbaca
- `justify-items` dan `align-items` meratakan isi sel, sedangkan `justify-content`/`align-content` mengatur penyebaran trek
- `grid-auto-flow: row` (default) mengisi baris lebih dulu ketika menempatkan item otomatis
- `grid-auto-rows` menentukan tinggi baris yang dibuat di luar template baris eksplisit
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.