CSS-animaatiogeneraattori laiskoille ihmisille.
CSS-animaatiot
CSS mahdollistaa HTML-elementtien animoinnin ilman JavaScriptiä tai Flashiaa
Tässä luvussa opit seuraavan ominaisuuksista:
- @keyframes
- animaation nimi
- animaatio-kesto
- animaatio-viive
- animaatioiden iteraatioiden määrä
- animaatio-ohjaus
- animaatio-ajoitustoiminto
- animaatio-täyttötila
- animaatio
Selainkohtaiset etuliitteet
Jotkut vanhemmat opiet tarvitsevat erityisiä etuliitteitä (-webkit-) ymmärtääkseen animaatiota
Mitä ovat CSS-animaatiot?
Animaatio antaa elementin muuttua asteittain tyylistä toiseen.
Voit muuttaa niin monta CSS-ominaisuutta kuin haluat, niin monta kertaa kuin haluat.
Jotta voit käyttää CSS-animaatiota, sinun on ensin määritettävä animaatiolle avainkehys.
Avainkehykset sisältyvät elementin määräykseen määrätyylejä.
@keyframes-sääntö
Kun määrität CSS-tyylejä @keyframes-säännössä, animaatio muuttuu vähitellen nykyisestä tyylistä uuteen tyyliin tiettynä vuoden aikana.
