Uitdaging: CSS-Animatie Implementeren
Taak
Verhoog de visuele aantrekkingskracht van het autorisatieformulier door een animatie toe te voegen aan de "Log in"-knop. Volg deze stappen:
- Geef de juiste waarde op voor de eigenschap
animation-name
, gebruikmakend van de vooraf ingestelde statuswijzigingen gedefinieerd in de@keyframes
-regel met de naamcolorChange
. - Stel de tijdsfunctie in op
linear
voor een consistente snelheid gedurende de animatie. - Definieer een duur van
6000ms
voor de animatie. - Stel de animatie in om
infinite
keren te herhalen voor een continu effect.
index.html
index.css
- Wijs de naam van de
@keyframes
-regel toe als waarde voor de eigenschapanimation-name
. - Specificeer
linear
als waarde voor de eigenschapanimation-timing-function
om een gelijkmatige snelheid te garanderen. - Stel de eigenschap
animation-duration
in op6000ms
om de duur van de animatie te bepalen. - Gebruik
infinite
als waarde voor de eigenschapanimation-iteration-count
om de animatie oneindig te herhalen.
index.html
index.css
Was alles duidelijk?
Bedankt voor je feedback!
Sectie 4. Hoofdstuk 6
Vraag AI
Vraag AI
Vraag wat u wilt of probeer een van de voorgestelde vragen om onze chat te starten.
Awesome!
Completion rate improved to 2.04
Uitdaging: CSS-Animatie Implementeren
Veeg om het menu te tonen
Taak
Verhoog de visuele aantrekkingskracht van het autorisatieformulier door een animatie toe te voegen aan de "Log in"-knop. Volg deze stappen:
- Geef de juiste waarde op voor de eigenschap
animation-name
, gebruikmakend van de vooraf ingestelde statuswijzigingen gedefinieerd in de@keyframes
-regel met de naamcolorChange
. - Stel de tijdsfunctie in op
linear
voor een consistente snelheid gedurende de animatie. - Definieer een duur van
6000ms
voor de animatie. - Stel de animatie in om
infinite
keren te herhalen voor een continu effect.
index.html
index.css
- Wijs de naam van de
@keyframes
-regel toe als waarde voor de eigenschapanimation-name
. - Specificeer
linear
als waarde voor de eigenschapanimation-timing-function
om een gelijkmatige snelheid te garanderen. - Stel de eigenschap
animation-duration
in op6000ms
om de duur van de animatie te bepalen. - Gebruik
infinite
als waarde voor de eigenschapanimation-iteration-count
om de animatie oneindig te herhalen.
index.html
index.css
Was alles duidelijk?
Bedankt voor je feedback!
Sectie 4. Hoofdstuk 6