Transitions
Explore how to apply CSS transitions to animate property changes over time. Learn to use transition properties like duration, timing function, and delay, and activate transitions with pseudo-classes for smooth visual effects in web design.
Transitions in CSS
Now, let’s take a look at how to animate components using CSS transitions!
A transition occurs when we tell a CSS property value to change over a specified period of time.
We do this with the transition property, which is shorthand for the following properties:
transition-propertytransition-durationtransition-timing-functiontransition-delay
See how these properties look in the code snippet below:
.element {
transition-property: property;
transition-duration: duration;
...