Bootstrap 5 GridLesson 42Preview gratis
BS5 Stacked/Horizontal
Lesson ini bagian dari Bootstrap · Semua level
Ringkasan
Pada layar kecil, kolom Bootstrap secara bawaan menumpuk secara vertikal (stacked). Agar kolom berdampingan (horizontal) hanya di layar tertentu, tambahkan kelas dengan breakpoint seperti .col-md-4. Konsep ini membuat satu tata letak dapat melayani perangkat mobile sekaligus desktop tanpa duplikasi kode.
Poin kunci
- Tanpa breakpoint, kolom menumpuk vertikal di semua layar.
- Kelas .col-md-4 membuat kolom berdampingan mulai breakpoint md.
- Lebar kolom dihitung dari 12 bagian, sehingga 4 berarti sepertiga baris.
- Berbagai kolom digabung, misal .col-12 .col-md-4 untuk tampilan penuh di ponsel.
- Breakpoint sm, md, lg, xl, xxl dapat dipilih sesuai kebutuhan.
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.