Aturan Dari Sistem Grid Materialize CSS Framework

Untuk responsivenya sendiri sistem grid ini sudah otomatis responsive ketika kita kecilkan layarnya maka kolomnya akan tetap terjaga. Sekarang kita akan menjelaskan aturan dari sistem grid pada Materialize CSS Framework. Aturan sistem gridnya adalah ukuran .s = small .m = medium dan juga ukuran .l = large. Untuk ukuran .s ini akan berlaku pada layar lebih kecil dari 600px untuk ukuran .m berlaku pada layar yang ukuran layarnya lebih kecil dari 992px sedangkan untuk .l lebih besar dari 992px. Jadi teman teman bisa mengatur sistem grid dengan aturan-aturan yang sudah ada pada materialize. Misalnya saya berikan class m12

dengan class m12 yakni ukuran desktop yang akan kita lihat pada ukuran sekarang maka akan menggunakan full lebarnya 12 meskipun ada s6 disana

Kesimpulannya ketika ukurannya lebih kecil dari 992px dan lebih besar dari 600px maka kolom yang pertama lebarnya akan menjadi full kolom tapi jika diresize layarnya sampai lebih kecil dari 600px maka content kolomnya akan dibagi menjadi 2.

Jadi konsep ini seperti gunakan if else di bahasa pemrograman ketika lebih kecil dari 600px maka kita gunakan class s4 sedangkan lebih besar dari 600px maka gunakan class m12. Tapi pada dasarnya jika tidak akan ubah layoutnya kita gunakan .s saja untuk semua ukuran layar tapi jika ingin mengubah spesifik small, medium, dan largenya. Kita bisa tumpuk seperti contoh berikut

ada 3 class yang bisa kita mainkan sangatlah simple. Semoga jelas dan terima kasih.

12 Agustus 2016

Webinar Gratis 2024


Selanjutnya Pada Bulan Maret 2024

Sabtu, 09 Maret 2024


10 Bahasa Rekomendasi Untuk Dipelajari di 2024

Python Developer, Data Science, Web Application

Kursus Python Django Web Application 2024 di DUMET School Kursus Postgre SQL Database Developer Terbaik 2024 di Jakarta
chat