CSS3 Study notes Two

Next is the process of moving, rotating, tilting, and shrinking the graphics.

-moz-transform:translatex (x deg) Translatey (x deg);/* Graphics move along the XY axis */

-moz-transform:rotate (x deg);/* The graph rotates around the origin of course can also be changed to the XY axis */

-moz-transform:skew (x deg);/* Graphic tilt */

-moz-transform-origin:0% 0%;/* Change the position of the coordinate origin in the graph */

-moz-transform:scale ();/* zoom in on a graphic greater than 1 is enlarged, less than 1 is greater than 0 is reduced, less than 0 will have the effect of reversal and then shrink */

And then the point came, Perspective,perspective-origin.

Perspective: Can be understood as the distance of the lens in the interface, is the direction of your eyes, this will affect the perspective of 3D graphics, perspective value when the graph will be small, basically is far smaller, of course, if the z-axis value of less than the graph will be equivalent to look inside the stereoscopic figure.

Perspective-origin: Can be understood as the distance of the lens, that is, the equivalent of a beam of light from different orientations of the object will have a different shadow this is the shadow we see 3D graphics.

CSS3 Study notes Two