Daftar dan Belajar Sekarang!

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

Poin: 240 EXP

❱ Intro css3

Apa itu css3

❱ Border dan box

Border radius Box shadow Box sizing dan vendor prefix download icon

❱ Menghias text

Text shadow Word wrap dan Text overflow download icon

❱ 2d transform

Translate dan rotate Scale dan Skew download icon

❱ Transition

Transition download icon

❱ 3d transform

Perspective 3d translate and rotate 3D Scale pada css download icon

❱ Membuat efek flipcard

Membuat kartu part1 Membuat kartu part2 download icon

❱ Animation

Perkenalan animasi dan keyframes Iteration dan direction Delay, fillmode, timing dan playstate Keyframes dengan persen download icon

❱ Property baru lainnya

Property baru background Overflow resize dan opacity Font face dan google font download icon

❱ Selektor baru

Pseudo classes Pseudo nth child Pseudo pada input download icon

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


Belajar CSS3

time icon 2 tahun yang lalu
level icon Pertengahan