CSS (Cascading Style Sheet) secara teori memang hanya bahasa styling untuk melengkapi kerangka website HTML, tapi sebenarnya CSS adalah kekuatan utama pada sebuah website. Tanpa CSS yang baik, bisa dipastikan tampilan website ya begitu-begitu saja.. Di post kali ini, saya lagi ingin berbagi kumpulan tutorial-tutorial yang pernah saya buat, dimana sebagian besar tutornya membahas CSS dengan lebih detail. Dicek aja dulu yuk..
CSS Layouting
- Membuat Layout Header Diam di Tempat (Fix Header) - Tutorial paling sering dicari nih.. Disini kita akan belajar membuat layout yang bagian headernya tetap diam diatas sekalipun website discroll sampai ke bawah.. Ternyata nggak susah-susah banget lho..
- Tutorial Lengkap Memahami CSS Position - Tutorial yang ini lebih ke arah penjelasan cara menggunakan CSS Position. Setelah menguasai bagian ini, pasti kita jadi bisa membedakan Position Static, Relative, Absolute, dan Fixed..
- Tutorial Layouting : Membuat Grid Sama Tinggi - Membuat kolom yang tingginya sama itu nggak segampang yang kita kira lho.. Di tutorial ini kita akan belajar beberapa teknik dan cara-caranya..
- Membuat Table Responsive dengan CSS - Tabel yang dibuka di tampilan mobile / smartphone umumnya melewati batas.. Di tutorial ini kita akan belajar mengatasi hal tersebut..
- Membuat Layout Responsive dengan Container Bootstrap - Tutorial paliiiiiing dasar tentang bootstrap nih.. Hehehe..
- Responsive Layout dengan Bootstrap [Part 2] - Ini adalah tutorial lanjutan tentang penggunaan kolom di bootstrap.
- Membuat Responsive dan Fleksibel Image Gallery dengan JQuery Fleximage - Peletakan gambar yang lebar dan tingginya bervariasi bisa dibuat rapi dan responsive? Jawabannya bisa banget!
/*CSS Layouting*/
css{
color:#ddd;
}
CSS Tips n Trick
- Membuat Tooltip dengan CSS - Tutorial pertamaku di jagocoding nih.. wkwkw
- Memanfaatkan CSS Animasi Transisi - Animasi transisi ini akan membantu setiap efek di website kita jadi lebih smooth lho.. Penting nih..
- Memanfaatkan CSS Animasi Part 2 - Tutorial lanjutan tentang animasi yang lebih kompleks.
- Membuat Animasi Loading Bubble dengan Full CSS - Cukup unik untuk dicoba nih..
- Membuat Custom Button Captcha dengan Font Awesome - Bosan dengan captcha yang begitu-begitu aja? Di tutorial ini kita akan belajar membuat Captcha dalam model tombol icon yang unik..
- Membuat Desain Custom Input (Checkbox + Radio Button) pada Form - Form Control seperti radio button dan checkbox bisa kita desain menjadi unik lho.. Cek aja di tutorial ini..
Lain-lain
- Tutorial Dasar CSS Preprocessor LESS
- Membuat dan Menampilkan QR Code Secara Dinamis dengan PHP
- Membuat Smooth Scrolling dalam 1 Halaman dengan JQuery
Nah, demikian kumpulan tutorial-tutorial yang bisa saya bagikan, semoga bermanfaat ya.. Kalau ada request untuk membuat tutorial lain dipersilakan deh, biar kita bisa sama-sama belajar..