CSS3 2D转换
旋转rotate
通过指定的角度参数对原元素指定一个2D rotation。
transform:rotate(<angle>);
angle为正数时，顺时针旋转；负数时逆时针旋转。
移动translate
translateX(x)仅水平方向移动(x轴移动)；
translateY(y)仅垂直方向移动(y轴移动)；
translate(x,y)水平方向和垂直方向同时移动。
缩放scale
scaleX(x)仅水平方向缩放(x轴缩放)；
scaleY(y)仅垂直方向缩放(y轴缩放)；
scale(x,y)水平方向和垂直方向同时缩放。
扭曲skew
skewX(x)仅水平方向扭曲变形(x轴扭曲变形，正值时逆时针扭曲)；
skewY(y)仅垂直方向扭曲变形(y轴扭曲变形，正值时顺时针扭曲)；
skew(x,y)水平方向和垂直方向同时扭曲。
CSS3 3D转换
旋转rotateX（围绕x轴旋转）
rotateX方法指定对象在x轴上的旋转角度。
transform:rotateX(<angle>);
旋转rotateY（围绕y轴旋转）
rotateY方法指定对象在Y轴上的旋转角度。
transform:rotateY(<angle>);
旋转rotateZ
rotateZ方法指定对象在Z轴上的旋转角度。
transform:rotateZ(<angle>);
旋转rotate3d
rotate3d方法指定对象的3D旋转角度。
transform:rotate3d(x,y,z,angle);//参数不允许省略
缩放scaleZ
scaleZ方法指定对象的z轴缩放
transform:scaleZ(z);
缩放scale3d
rotate3d方法指定对象的3D缩放。
transform:scale3d(x,y,z);//参数不允许省略
CSS3 Transform与坐标系统
transform-origin
transform-origin属性允许你更改转换元素的位置
transform-origin:x-axis y-axis z-axis;
CSS3 扩展属性
transform-style
transform-style属性指定嵌套元素是怎样在三维空间中呈现。
transform-style:flat(默认值)|preserve-3d
perspective
指定观察者距离与[z=0]平面的距离，使具有三维位置变化的元素产生透视效果
perspective:number|none;
perspective-origin
指定透视点的位置。
perspective-origin:x-axis y-axis;
backface-visibility
指定元素背面面向用户时是否可见。
backface-visibility:visible|hidden;
