Pelajari Bagaimana CSS Grid Properties Bekerja Dengan Griddy.io
Jika Anda mengikuti perkembangan teknologi desain web maka Anda harus tahu tentang kisi-kisi CSS. Properti-properti ini tambahan baru ke format CSS3 dan mereka dengan cepat menjadi sahabat pengembang.
Kami baru-baru ini membahas permainan yang menyenangkan untuk membantu Anda mempelajari properti kotak CSS, tetapi permainan tidak selalu mengajarkan ide-ide praktis. Di situlah Griddy mungkin lebih berguna.
Aplikasi web gratis ini memungkinkan Anda ubahsuaikan kisi secara real time dan perbarui cuplikan langsung di halaman. Anda dapat mengacaukan dengan kisi khusus Anda sendiri dengan mendefinisikan kolom, selokan, dan margin, dan merestrukturisasi halaman untuk mempelajari cara kerja properti kisi.
Griddy sebenarnya adalah alat belajar gratis yang dibuat untuk pengembang frontend yang ingin mengerti lebih banyak tentang kisi-kisi CSS.
Dengan aplikasi web ini, Anda dapat menambahkan item baru ke dalam kisi, menghapus item lain, dan mengubah ukurannya agar sesuai dengan tata letak yang Anda inginkan.
Webapp memiliki bagian yang berbeda dengan bidang input yang berbeda untuk mengedit properti kotak. Ini memungkinkan Anda memformat ulang baris / kolom kisi dan mereka mengajarkan Anda persis apa yang kamu lakukan sepanjang jalan.
Anda bisa menentukan celah kolom, menyelaraskan item kisi, dan bermain dengan pengaturan justifikasi - semua melalui kolom formulir ini. Setiap kali Anda melakukan perubahan, pembaruan secara otomatis pratinjau dan cuplikan kode kecil di bawahnya.
Dengan cara ini Anda bisa menyalin dan menempelkan CSS ke lembar gaya Anda sendiri jika Anda ingin mengacaukannya lebih lanjut. Sangat keren!
Griddy mungkin tidak menyenangkan seperti Grid Garden tetapi Griddy adalah cara praktis untuk belajar dan mengerti secara visual bagaimana properti kotak CSS mempengaruhi elemen halaman.
Untuk bermain-main dengannya cukup kunjungi beranda Griddy. Anda juga dapat membagikan pemikiran atau pertanyaan Anda dengan pembuatnya di Twitter @drewisthe.
