Combiner les transitions
Il est possible de regrouper toutes les propriétés liées à la transition sur une seule ligne.
transition: <property> <time> <time_function> <delay>;
Supposons qu'il soit nécessaire d'ajouter une propriété de transition à l'élément. Les attentes sont les suivantes :
- modification de la propriété
background-color; - durée de
1.2s; - fonction de temps
ease-in-out; - délai de
250ms.
Forme longue
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Forme abrégée
transition: background-color 1200ms ease-in-out 250ms;
Remarque
Il n'y a aucune différence de syntaxe pour le navigateur. Nous pouvons choisir l'option que nous préférons.
Merci pour vos commentaires !
Demandez à l'IA
Demandez à l'IA
Posez n'importe quelle question ou essayez l'une des questions suggérées pour commencer notre discussion
Génial!
Completion taux amélioré à 2.08
Combiner les transitions
Glissez pour afficher le menu
Il est possible de regrouper toutes les propriétés liées à la transition sur une seule ligne.
transition: <property> <time> <time_function> <delay>;
Supposons qu'il soit nécessaire d'ajouter une propriété de transition à l'élément. Les attentes sont les suivantes :
- modification de la propriété
background-color; - durée de
1.2s; - fonction de temps
ease-in-out; - délai de
250ms.
Forme longue
transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;
Forme abrégée
transition: background-color 1200ms ease-in-out 250ms;
Remarque
Il n'y a aucune différence de syntaxe pour le navigateur. Nous pouvons choisir l'option que nous préférons.
Merci pour vos commentaires !