CSS Visual ToolsLesson 77Preview gratis
Animation Generator
Lesson ini bagian dari Web Developer Tools · Semua level
Ringkasan
Animation generator membantu membuat animasi CSS dari keyframes hingga properti durasi dan pengulangan. Kamu dapat mengatur tahapan animasi, timing function, arah, dan fill mode lalu menyalin kode yang dihasilkan. Animasi sebaiknya dipakai untuk memperjelas interaksi, bukan mengganggu pembacaan konten.
Poin kunci
- @keyframes mendefinisikan tahapan animasi dari 0% sampai 100%
- animation-name menghubungkan elemen dengan keyframes
- animation-duration mengatur lama satu siklus animasi
- animation-iteration-count: infinite membuat animasi berulang terus
- animation-fill-mode: forwards mempertahankan gaya akhir setelah animasi selesai
Materi lengkap
Contoh kode dan kuis
Materi lengkap, contoh kode, dan kuis tersedia untuk pelanggan. 5 soal.