Podemos combinar todas las propiedades relacionadas con las transiciones en una sola línea.

transition: <property> <time> <time_function> <delay>;

Supongamos que necesitamos agregar una propiedad de transición al elemento. Se espera:

• el cambio de la propiedad background-color;
• la duración del tiempo es 1.2s;
• la función de tiempo debe ser ease-in-out;
• el retraso es 250ms.

Forma larga

transition-property: background-color;
transition-duration: 1200ms;
transition-timing-function: ease-in-out;
transition-delay: 250ms;

Forma abreviada

transition: background-color 1200ms ease-in-out 250ms;

Nota

No existe ninguna diferencia en la sintaxis para el navegador. Podemos seleccionar cualquier opción que prefiramos.