Animasjon med Transition Side 248

Oppgave

1. Endre fargen på firkanten.

2. Forklar hvordan animasjonen starter. Hvor lenge varer animasjonen?

3. Animer også høyden med 400 piksler.

4. Bruk transition-property: all;

5. Endre kvadratet til et rektangel.

Skriv inn/rediger koden:

<!DOCTYPE html> <html lang="no"> <head> <meta charset="UTF-8"> <title>CSS Transitions</title> <style> .firkant { width: 50px; height: 50px; background-color: limegreen; transition: width 10s; } .firkant:hover { width: 200px; } </style> </head> <body> <div class="firkant"></div> </body> </html>

Resultat av koden: