Summary
It would be entirely possible to fill multiple books covering the possibilities of CSS transforms, transitions, and animations. Hopefully, by dipping your toe in the water with this chapter, you’ve been able to pick up the basics and run with them.
In this chapter, we’ve learned what CSS transitions are and how to write them. We got a handle on timing functions like ease
and linear
, and then used them to create simple but fun effects. We then learned all about 2D transforms like scale
and skew
, and how to use them in tandem with transitions. We also looked briefly at 3D transformations before learning all about the power and relative simplicity of CSS animations. You’d better believe our CSS muscles are growing!
In the next chapter, we are going to look in depth at CSS custom properties and functions. These are recent additions to CSS, in comparison to things like media queries, and we will see how in many responsive situations, functions like...