Kombinera Övergångar
Alla övergångsrelaterade egenskaper kan kombineras på en rad.
transition: <property> <time> <time_function> <delay>;
Anta att en övergångsegenskap behöver läggas till på elementet. Förväntat resultat:
- ändring av egenskapen
background-color
; - tidslängd är
1.2s
; - tidsfunktion ska vara
ease-in-out
; - fördröjning är
250ms
.
Lång form
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Kortform
transition: background-color 1200ms ease-in-out 250ms;
Obs
Det finns ingen skillnad i syntax för webbläsaren. Vi kan välja det alternativ vi föredrar.
Tack för dina kommentarer!
Fråga AI
Fråga AI
Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal
Can you explain what each part of the shorthand transition property does?
Are there other properties besides background-color that can be transitioned?
Why would I use the shorthand form instead of the long form?
Awesome!
Completion rate improved to 2.04
Kombinera Övergångar
Svep för att visa menyn
Alla övergångsrelaterade egenskaper kan kombineras på en rad.
transition: <property> <time> <time_function> <delay>;
Anta att en övergångsegenskap behöver läggas till på elementet. Förväntat resultat:
- ändring av egenskapen
background-color
; - tidslängd är
1.2s
; - tidsfunktion ska vara
ease-in-out
; - fördröjning är
250ms
.
Lång form
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Kortform
transition: background-color 1200ms ease-in-out 250ms;
Obs
Det finns ingen skillnad i syntax för webbläsaren. Vi kan välja det alternativ vi föredrar.
Tack för dina kommentarer!