Kombinering af Overgange
Vi kan kombinere alle overgangsrelaterede egenskaber på én linje.
transition: <property> <time> <time_function> <delay>;
Forestil dig, at vi skal tilføje en overgangsegenskab til elementet. Vi forventer:
- ændring af
background-coloregenskaben; - varighed på
1.2s; - tidsfunktion skal være
ease-in-out; - forsinkelse på
250ms.
Lang form
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Kort form
transition: background-color 1200ms ease-in-out 250ms;
Bemærk
Der er ingen forskel i syntaksen for browseren. Vi kan vælge den mulighed, vi foretrækker.
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
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?
Fantastisk!
Completion rate forbedret til 2.08Kombinering af Overgange
Stryg for at vise menuen
Vi kan kombinere alle overgangsrelaterede egenskaber på én linje.
transition: <property> <time> <time_function> <delay>;
Forestil dig, at vi skal tilføje en overgangsegenskab til elementet. Vi forventer:
- ændring af
background-coloregenskaben; - varighed på
1.2s; - tidsfunktion skal være
ease-in-out; - forsinkelse på
250ms.
Lang form
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Kort form
transition: background-color 1200ms ease-in-out 250ms;
Bemærk
Der er ingen forskel i syntaksen for browseren. Vi kan vælge den mulighed, vi foretrækker.
Tak for dine kommentarer!
