Bootstrap - Demo Grid
Apa itu Grid?
Dalam desain grafis, kisi adalah struktur (biasanya dua dimensi) yang terdiri dari serangkaian garis lurus (vertikal, horizontal) berpotongan yang digunakan untuk menyusun konten. Ini banyak digunakan untuk merancang tata letak dan struktur konten dalam desain cetak. Dalam desain web, ini adalah metode yang sangat efektif untuk membuat tata letak yang konsisten dengan cepat dan efektif menggunakan HTML dan CSS.
Bekerja dari Sistem Grid Bootstrap
Sistem kisi digunakan untuk membuat tata letak halaman melalui serangkaian baris dan kolom yang menampung konten Anda. Inilah cara kerja sistem grid Bootstrap -
Baris harus ditempatkan dalam a .container kelas untuk perataan dan bantalan yang tepat.
Gunakan baris untuk membuat kelompok kolom horizontal.
Konten harus ditempatkan dalam kolom, dan hanya kolom yang boleh menjadi turunan langsung dari baris.
Kelas grid standar seperti .row and .col-xs-4tersedia untuk membuat tata letak kisi dengan cepat. Mixin LESS juga dapat digunakan untuk tata letak yang lebih semantik.
Kolom membuat talang (celah antara konten kolom) melalui padding. Padding tersebut diimbangi dalam baris untuk kolom pertama dan terakhir melalui margin negatif pada.rows.
Kolom kisi dibuat dengan menentukan jumlah dua belas kolom yang tersedia yang ingin Anda bentangkan. Misalnya, tiga kolom yang sama akan menggunakan tiga.col-xs-4.
Contoh | Deskripsi | Tautan unduhan |
---|---|---|
Kisi | Contoh ini menunjukkan tentang struktur grid di Bootstrap. | Unduh |