Comment puis-je transférer efficacement plusieurs propriétés CSS à l'aide de la notation abrégée ?

Transition de plusieurs propriétés CSS avec une notation abrégée

En CSS, la transition de plusieurs propriétés simultanément peut être réalisée à l'aide de la notation abrégée de transition. Cependant, trouver la syntaxe correcte peut être délicat.

La syntaxe abrégée comprend quatre modificateurs facultatifs dans l'ordre suivant : propriété, durée, fonction de synchronisation et délai.

transition: <property> || <duration> || <timing-function> || <delay> [, ...];

Notez que le la durée doit précéder le délai, si spécifié.

Pour effectuer une transition collective entre plusieurs propriétés, séparez-les simplement par des virgules dans la propriété de transition. Par exemple :

transition: height 0.3s ease-out, opacity 0.3s ease 0.5s;

Cette déclaration fera passer la propriété height sur 0,3 seconde, en s'atténuant, et la propriété d'opacité sur 0,3 seconde, en s'atténuant après un délai de 0,5 seconde.

Alternativement , vous pouvez appliquer la même transition à toutes les propriétés :

transition: all 0.3s ease-out;

Cette déclaration abrégée fera la transition entre toutes les propriétés 0,3 seconde, ce qui s'atténue.

En utilisant ces notations abrégées, vous pouvez rationaliser votre CSS et effectuer une transition concise entre plusieurs propriétés.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!