In this section, we will learn what the transaction property is and how to use it in CSS.
CSS transition Property Definition and Usage
The CSS `transition` property is a shorthand property by which we can create a smooth transition.
Basically, using this property, we can set values for the following properties in one declaration:
CSS transition Property Syntax
transition: t-property t-duration t-timing-function t-delay;
CSS transition Property Value
As mentioned before, the transition property is a shorthand one by which we can set values for other related properties mentioned above.
So any value we could use for those properties can also be placed as the value of the `transition` property as well.
We can also set multiple transitions as the value for this property and in that case, each transition should be separated using comma ‘,’.
transition: color 1s, background-color 2s ease-in, font-size 2s ease-out 500ms;
Note: there’s a keyword named “all” that can be used for the value of this property, and if used, it includes the entire properties of the target element in the transition process.