TheDevSpace
CourseCommunityPricingBoilerplates
Sign In
Table of Contents
  • The transition timing function
  • linear
  • ease
  • ease-in
  • ease-out
  • ease-in-out
  • step-start
  • Transition delay
  • The shorthand

What are CSS Transitions

PrevNext

In one of the previous lessons, we introduced the pseudo-selectors, which allow you to define properties that only activate when the element is under a particular state. For example, with the following setup, the <div> will double its width when the cursor is hovered on top.

css
1div {
2  padding: 10px;
3  margin: auto;
4  border: 2px solid darkviolet;
5