The Book of CSS3 - A Developer\'s Guide to the Future of Web Design (2nd edition)

(C. Jardin) #1

12


2D Tr ansformaTions


Because of the way HTML works, with each
element composed of rectangular blocks
and right-angled corners, web pages have
traditionally appeared boxy, with lots of straight

horizontal and vertical lines, and the only way to pro-


vide any variation to this rule was to use images. But


back in 2008, the WebKit team proposed a new module that allows elements
to be rotated, scaled, skewed, and generally messed around with. This mod-
ule was adopted for standardization by the W3C and formalized as the
2D Transformations Module (http://www.w3.org/TR/css3-2d-transforms/).
Much of the process for transforming elements was adapted from func-
tions in the Scalable Vector Graphics (SVG) language, which is used for drawing
two-dimensional vector images. SVG is supported by most modern browsers,
so Firefox and Opera were quick to implement 2D Transformations in their
own products, and IE9 followed along shortly.
The transformation properties for CSS and SVG were so similar, in
fact, that the W3C decided to merge them into a single common specifica-
tion, CSS Transforms (http://dev.w3.org/csswg/css-transforms/), which is where


PX

3024
Free download pdf