Learning CSS3 Animations and Transitions: A Hands-on Guide to Animating in CSS3 with Transforms, Transitions, Keyframes, and JavaScript

2. Building a Foundation with Transforms

Transforms serve as the foundation for many of the animations described in this book. This chapter introduces the various kinds of two-dimensional transforms that can be accomplished with CSS3. As a sample project, you will create a bicycle using only CSS, and you will use CSS3 transforms to assist in its creation.

Introducing Transforms

With CSS3 transforms, you can manipulate elements by using various transform functions, changing their skew, scale, and rotation, for example. You use the transform property together with one or more transform functions that define how to change an element. These are the available transform functions:

rotate:         You use this function to rotate an element clockwise ...