CSS3 the difference between flipping and rotating

I used to think that the rotation and the same as flipping, today's own rotation for a long time to find and flip almost point, tangled more than 10 minutes to understand, can only blame their three-dimensional too bad.

CSS3 in the transform in the rotation, contraction, tilt, the function of translation, respectively, the corresponding properties are: Rotate,scale,skew,translate

Rotation: (rotate)

-webkit-transform:rotate (10deg);  -moz-transform:rotate (10deg);  Transform:rotate (10deg);   /* */

Flip: (Scale)

(This property is the function of the indentation, how can be flipped!) Original brackets inside (the first) represents the x-axis, the latter represents the y-axis, when the number is greater than 1 o'clock magnification, greater than 0 and less than 1 o'clock reduction, negative for flipping)

Flip horizontally:

-webkit-transform:scale ( -1,1);  -moz-transform:scale ( -1,1);  Transform:scale ( -1,1);   /* */

Flip vertically:

-webkit-transform:scale (1,-1);  -moz-transform:scale (1,-1);  Transform:scale (1,-1); /* */  

Online Example: http://hovertree.com/code/css/css3dxuanzhuan.htm

Special effects: http://www.cnblogs.com/roucheng/p/texiao.html

CSS3 the difference between flipping and rotating