HTML and CSS Reference
In-Depth Information
FIGURE 5.4
Rotating the
example container.
ROTATE
As you might expect, the
rotate
transform allows you to rotate an element. In the
transform-2drotate.html file you'll find the following line:
transform: rotate(15deg);
which produces the effect shown in
Figure 5.4
.
As you can see from this example, a positive
deg
(degree) value rotates the ele-
ment clockwise. You can use a negative degree value for counterclockwise rotations.
For the mathematically minded, you can use radians instead of degrees (e.g.,
1rad
),
although this is of limited use, because there is no way to accurately represent PI
in CSS values, which working with radians heavily relies on.
Try altering the values to see what you get!
