CSS-animationsgenerator för lata människor.
CSS-animationer
CSS tillåter animering av HTML-element utan att använda JavaScript eller Flash
I det här kapitlet kommer du att lära dig om följande egenskaper:
- @nyckelrutor
- animationsnamn
- animation-varaktighet
- animationsfördröjning
- animation-iteration-count
- animation-riktning
- animation-timing-funktion
- animation-fill-läge
- animation
Webbläsarspecifika prefix
Vissa äldre webbläsare behöver specifika prefix (-webkit-) för att förstå animeringsegenskaperna
Vad är CSS-animationer?
En animering låter ett element gradvis ändras från en stil till en annan.
Du kan ändra hur många CSS-egenskaper du vill, hur många gånger du vill.
För att använda CSS-animering måste du först ange några nyckelrutor för animeringen.
Keyframes innehåller vilka stilar elementet kommer att ha vid vissa tidpunkter.
@keyframes-regeln
När du anger CSS-stilar i @keyframes-regeln kommer animeringen gradvis att ändras från den nuvarande stilen till den nya stilen vid vissa tidpunkter.
