Introduksjon til CSS-transformasjoner
Vi kan legge til bevegelse på nettsidene våre. Transformasjoner endrer et elements form og posisjon uten å påvirke resten av siden. Dermed kan vi oppnå følgende effekter:
Vi kan legge til skalering på elementene:
Vi kan legge til rotasjon på elementene:
Vi kan legge til translasjon på elementene:
Vi kan legge til skeving på elementene:
Merk
Vi oppnår alle disse effektene ved hjelp av én egenskap –
transform
– med ulike verdier. Det er også viktig å nevne atanimation
og@keyframe
kun er lagt til for å vise forskjellen mellom start- og slutt-tilstand for elementet. Dette betyr ikke attransform
kun brukes sammen med animasjoner. Vi vil gå gjennom alle effektene i detalj i de neste kapitlene.
Takk for tilbakemeldingene dine!
Spør AI
Spør AI
Spør om hva du vil, eller prøv ett av de foreslåtte spørsmålene for å starte chatten vår
Awesome!
Completion rate improved to 2.04
Introduksjon til CSS-transformasjoner
Sveip for å vise menyen
Vi kan legge til bevegelse på nettsidene våre. Transformasjoner endrer et elements form og posisjon uten å påvirke resten av siden. Dermed kan vi oppnå følgende effekter:
Vi kan legge til skalering på elementene:
Vi kan legge til rotasjon på elementene:
Vi kan legge til translasjon på elementene:
Vi kan legge til skeving på elementene:
Merk
Vi oppnår alle disse effektene ved hjelp av én egenskap –
transform
– med ulike verdier. Det er også viktig å nevne atanimation
og@keyframe
kun er lagt til for å vise forskjellen mellom start- og slutt-tilstand for elementet. Dette betyr ikke attransform
kun brukes sammen med animasjoner. Vi vil gå gjennom alle effektene i detalj i de neste kapitlene.
Takk for tilbakemeldingene dine!