Ketahui Bagaimana Ciri Grid CSS berfungsi dengan Griddy.io

Jika anda bersaing dengan teknologi reka bentuk web maka anda harus tahu mengenai grid CSS. Ciri-ciri ini adalah penambahan baharu pada format CSS3 dan mereka dengan cepat menjadi kawan terbaik pemaju.

Kami baru-baru ini merangkumi permainan yang menyeronokkan untuk membantu anda mengetahui sifat grid CSS, tetapi permainan tidak selalu mengajar idea praktikal. Di situlah Griddy mungkin lebih berguna.

Webapp percuma ini membolehkan anda menyesuaikan grid dalam masa sebenar dan kemas kini coretan langsung pada halaman. Anda boleh mengacaukan dengan grid tersuai anda sendiri dengan menentukan lajur, longkang, dan margin, dan menyusun semula halaman untuk mengetahui bagaimana sifat grid berfungsi.

Griddy sebenarnya a alat pembelajaran percuma yang dibuat untuk pemaju frontend yang ingin memahami lebih lanjut mengenai grid CSS.

Dengan webapp ini, anda boleh menambah item baru ke grid, mengalih keluar item lain, dan mengubah saiznya agar sesuai dengan susun atur yang anda inginkan.

Webapp mempunyai bahagian yang berbeza dengan medan input yang berbeza untuk menyunting sifat grid. Ini membolehkan anda memformat baris / lajur grid dan mereka mengajar anda apa yang anda lakukan sepanjang jalan.

Anda boleh menentukan jurang lajur, menyelaraskan item grid, dan bermain dengan tetapan justifikasi - semua melalui medan borang ini. Setiap kali anda membuat perubahan, ia akan mengemas kini pratonton dan potongan kod kecil di bawahnya.

Dengan cara ini, anda hanya boleh menyalin dan menyisipkan CSS ke dalam stylesheet anda sendiri jika anda ingin mengelakkannya dengan lebih lanjut. Cukup sejuk!

Griddy mungkin tidak seronok seperti Grid Garden tetapi Griddy adalah cara praktikal untuk belajar dan memahami secara visual bagaimana sifat grid CSS mempengaruhi elemen halaman.

Untuk bermain-main dengannya, lawati laman utama Griddy. Anda juga boleh berkongsi fikiran atau pertanyaan anda dengan pencipta di Twitter @drewisthe.