Even with the shorthand, specifying transitions for many properties can be tedious. It is common to use the same duration, timing function, and delay for multiple properties. When this is the case you can set the transition-property
value to all
. This will apply the same values to all properties. To effect this, you can use all
as a value for transition-property
.
all
means every value that changes will be transitioned in the same way. You can use all
with the separate transition properties, or the shorthand syntax. This allows you to describe the transition of many properties with a single line:
transition: all 1.5s linear 0.5s;
In this example, any change will be animated over one and a half seconds after a half-second delay with linear timing.
Instructions
Replace all the combined transitions with one single transition for all
.
Use a duration of 1.2s
, a timing function of ease-out
, and delay of 0.2s
.