Sammensetting av Flere Animasjoner
Vi kan bruke kortform for å angi alle animasjonsegenskaper. Syntaksen er som følger:
animation: <name> <duration> <timing_function> <delay> <iteration-count> <direction> <fill-mode> <play-state>
La oss skrive om de neste egenskapene i kortform.
Lang metode
animation-name: Rotation;
animation-duration: 5s;
animation-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
animation-delay: 100ms;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-fill-mode: backwards;
animation-play-state: running;
Kortform
animation: Rotation 5s cubic-bezier(0.075, 0.82, 0.165, 1) 100ms infinite alternate backwards running;
Dette kan virke forvirrende, og det er lett å overse en verdi. Likevel har vi denne muligheten.
Merk
For nettleseren er det ingen forskjell mellom kortform og lang metode for å angi animasjon.
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
Can you explain what each value in the shorthand means?
Are there any best practices for using the shorthand animation property?
What happens if I omit some values in the shorthand?
Awesome!
Completion rate improved to 2.04Sammensetting av Flere Animasjoner
Sveip for å vise menyen
Vi kan bruke kortform for å angi alle animasjonsegenskaper. Syntaksen er som følger:
animation: <name> <duration> <timing_function> <delay> <iteration-count> <direction> <fill-mode> <play-state>
La oss skrive om de neste egenskapene i kortform.
Lang metode
animation-name: Rotation;
animation-duration: 5s;
animation-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
animation-delay: 100ms;
animation-iteration-count: infinite;
animation-direction: alternate;
animation-fill-mode: backwards;
animation-play-state: running;
Kortform
animation: Rotation 5s cubic-bezier(0.075, 0.82, 0.165, 1) 100ms infinite alternate backwards running;
Dette kan virke forvirrende, og det er lett å overse en verdi. Likevel har vi denne muligheten.
Merk
For nettleseren er det ingen forskjell mellom kortform og lang metode for å angi animasjon.
Takk for tilbakemeldingene dine!
