transformations

Explanation: This CSS declaration (transform) allows you to style elements in a manner which would formerly have been done with images. We can scale and rotate elements (images or text).

Parameters (not complete, just more commonly used):

• rotate (angle)
• scale (number)
• scaleX (number)
• scaleY (number)
• skewX (angle)
• skewY (angle)

Example CSS code:

#orchid {
-webkit-transform: rotate(45deg);
-moz-transform:rotate(45deg);
-o-transform:rotate(45deg);
transform:rotate(45deg);
}

Example page (view the source code): http://learning-html5.info/CSS3/CSS_Transformations.html (mostly works in modern browsers).

References:

• http://dev.w3.org/csswg/css3-2d-transforms/
• http://dev.w3.org/csswg/css3-3d-transforms/
• https://developer.mozilla.org/En/CSS/Using_CSS_transforms
• http://www.webkit.org/blog/130/css-transforms/
• lynda.com tutorials