Vi kan lägga till rörelse på våra webbsidor. Transformationer ändrar en elements form och position utan att påverka resten av sidan. Därmed kan vi skapa följande effekter:

Vi kan lägga till skalning på elementen:

Vi kan lägga till rotation på elementen:

Vi kan lägga till förflyttning till elementen:

Vi kan lägga till skevning till elementen:

Obs

Alla dessa effekter uppnås med hjälp av en egenskap – transform med olika värden. Det är också viktigt att nämna att animation och @keyframe har lagts till enbart för att visa skillnaden mellan det initiala och det resulterande elementtillståndet. Det innebär inte att transform endast används tillsammans med vissa animationer. Vi kommer att gå igenom alla effekter mer detaljerat i kommande kapitel.