CSS AdvancedLesson 59Preview gratis
CSS Transitions
Lesson ini bagian dari CSS · Semua level
Ringkasan
Transisi membuat perubahan properti CSS berjalan halus dalam rentang waktu tertentu, misalnya saat elemen disorot kursor. Kita menentukan properti mana yang dianimasikan, durasinya, gaya percepatannya, dan keterlambatannya. Transisi bisa dibuat khusus untuk satu keadaan seperti `:hover` agar efek hanya terjadi saat diinginkan.
Poin kunci
- `transition-property` memilih properti yang dianimasikan, misalnya `background-color`
- `transition-duration` wajib diisi agar transisi terlihat, misalnya `0.3s`
- `transition-timing-function` mengatur kurva kecepatan seperti `ease`, `linear`, atau `ease-in-out`
- `transition-delay` menunda mulainya transisi; shorthand `transition` menulis semuanya sekaligus
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.