Belajar CSS3

CSS3 adalah versi terbaru dari css, ada banyak property-property baru yang bisa kita pelajari dan manfaatkan untuk website. Pastikan sudah familiar dengan dasar css sebelum mengikuti kelas ini

Detail Kelas

  • Apa itu css3

    CSS3 adalah versi terbaru dari css, ada banyak property-property baru yang bisa kita pelajari dan manfaatkan untuk website. Pastikan sudah familiar dengan dasar css sebelum mengikuti kelas ini

  • Border radius

    Border radius digunakan untuk mengatur radius dari sisi sisi elemen, kita bahkan bisa membuat suatu elemen berbentuk bulat dengan ini

  • Box shadow

    Menambahkan efek bayangan pada element html dengan menggunakan box shadow

  • Box sizing dan vendor prefix

    Vendor prefix adalah cara memberitahu browser tertentu yang belum sepenuhnya mendukung property baru di css3, ada juga box sizing untuk mengatur cakupan lebar dari suatu element

  • Text shadow

    Kalau sebelumnya kita belajar box shadow, ada juga text shadow untuk mengatur bayangan pada text, berikan efek keren pada text website kita

  • Word wrap dan Text overflow

    Atur bagaimana text dibungkus oleh css, dengan menggunakan property word wrap dan text overflow

  • Translate dan rotate

    Mulai mengubah konten secara 2d dengan property translate dan juga rotate

  • Scale dan Skew

    Mulai mengubah konten secara 2d dengan property Scale dan juga Skew

  • Transition

    Property transition pada css memberikan efek ketika melakukan perubahan pada element element tertentu

  • Perspective

    Atur perspective atau cara pandang dari satu elemen, untuk menampilkan kesans 3 dimensi

  • 3d translate and rotate

    Ternyata translate dan rotate bisa kita gunakan juga untuk membuat efek 3 dimensi!

  • 3D Scale pada css

    Melihat efek scale pada 3 dimensi

  • Membuat kartu part1

    Latihan memanfaatkan property 3 dimensi yang ada pada css, dengan membuat efek flip card

  • Membuat kartu part2

    Latihan memanfaatkan property 3 dimensi yang ada pada css, dengan membuat efek flip card bagian kedua

  • Perkenalan animasi dan keyframes

    Buat animasi melalui css ternyata sangat mungkin! lihat property animation dan juga apa itu keyframes

  • Iteration dan direction

    Mengatur iterasi dan arah pada animasi yang kita buat di css

  • Delay, fillmode, timing dan playstate

    Masih ada banyak lagi yang bisa kita atur dengan animasi pada css, diantaranya Delay, fillmode, timing dan playstate

  • Keyframes dengan persen

    Ternyata mengatur keyframes bisa kita lakukan dengan bantuan satuan % (persen), dengan ini animasi jauh lebih fleksibel

  • Property baru background

    Kita pernah melihat property background pada css dasar, dengan css3, masih banyak lagi yang bisa kita lakukan

  • Overflow resize dan opacity

    Konten yang melebihi batasnya, bisa diatur dengan property overflow resize, ada juga opacity untuk mengatur transparansi suatu elemen

  • Font face dan google font

    Bosan dengan font yang itu-itu saja? kita bisa mengambil font dari font lokal yang kita punya ataupun dari library gratis seperti google font

  • Pseudo classes

    Selektor yang bisa kita lakukan untuk memilih element html di berbagai macam kasus dengan pseudo classes

  • Pseudo nth child

    Mengatur elemen kebarapa bahkan dengan rumus pada css

  • Pseudo pada input

    Input juga punya berbagai macam pseudo classes, yang bisa kita manfaatkan untuk membuat lebih menarik pada css