Tutorial CSS Skeleton Lengkap Beserta Penjelasan

Tutorial CSS Skeleton  Lengkap Beserta Penjelasan  ~ Pada tutorial kali ini saya ingin sharing ilmu tentang cara menggunakan CSS Skeleton. Untuk pendahuluan saya akan menjelaskan apa itu CSS Skeleton ?

CSS Skeleton merupakan Freamwork CSS sama persis cara menggunakan Bootstrap, teteapi CSS Skeleton ini lebih memfokuskan kita pada penggunaan nama class yang menggunakan bahasa inggris.
 Seperti contoh :

• Class="twelve columns" ; // penggunaan grid pada css skeleton
  
• Class="u-full-width"; // penggunaan form input pada css skeleton

Cara menggunakan CSS Skeleton pada text editor :

1. Kunjungi dahulu situs resminya , dilahkan klik link berikut http://getskeleton.com/
2. Pada halaman pertama terdapat tombol download bewarna biru. Seperti dibawah ini :

3. Pada gambar diatas silahkan teman-teman klik tombol download maka akan menghasilkan sebuah download seperti  berikut :

4. Jika sudah muncul, silahkan download langsung dan extract file tersebut, lalu klik kanan pada index.html di dalam folder extractkan tadi buka dengan text-editor kalian masing-masing. Seperti Contoh Berikut :



5. Tahap berikutnya kita masukan kode yang ada di website CSS Skeleton, seperti contoh saya menggunakan form sebagai contoh :




6. Tahap berikutnya jalankan di browser teman-teman masing-masing, jika benar maka tampilannya seperti berikut :

Catatan : untuk pengaturan lainnya silahkan teman-teman rubah css terbut atau menambahkannya lagi

Dan untuk mempermudah proses pembelajaran kalian silahkan lihat video dibawah ini :

Sekian dari tutorial saya  ini semoga bermanfaat untuk teman-teman semuanya dan bagi teman-teman yang ingin download source kode nya silahkan klik tombol dibawah :

Download Source