CSS3转换
一、2D转换
1、css3 rotate()旋转
通过指定的角度参数对原元素指定一个2D rotation（2D 旋转）
语法：
transform:rotate(<angle>);
举个栗子：
transform:rotate(10deg); //deg:角度
transform:rotate(-10deg);
参数说明：
angle指旋转角度，正数表示顺时针旋转，负数表示逆时针旋转。
2、css3 translate() 平移
translate()方法,根据左（x轴）和顶部（Y轴）位置给定的参数，从当前元素位置移动
translate(x,y)水平方向和垂直方向同时移动（也就是X轴和Y轴同时移动）。
语法：
1、 translatX(<translation-value>)
通过给定一个X方向上的数目指定一个translation。
transform:translateX(<translation-value>);
举个栗子：
transform:translateX(200px);
transform:translateX(50%);
2、 translatY(<translation-value>)
通过给定一个Y方向上的数目指定一个translation。
transform:translateY(<translation-value>);
举个栗子：
transform:translateY(200px);
transform:translateY(50%);
3、translate(<translation-value>[,<translation-value>])
通过矢量[tx,ty]指定一个2D translation,tx是第一个过渡值参数，ty是第二个过度值参数选项。
transform:translate(<translation-value>[,<translation-value>]);
举个栗子：
transform:translate(200px,100px);
3、css3 scale() 缩放
scale()方法，指定对象的2D scale(2D缩放)。
三种情况:
1、scaleX(x)元素仅水平方向缩放（x轴缩放）；
scaleX(<number>)
使用[sx,1]缩放矢量执行缩放操作，sx为所需参数。
语法：
transform:scaleX(<number>);
举个栗子：
transform:scaleX(0.5);
transform:scaleX(50%);
2、scaleY(y)元素仅水平方向缩放（y轴缩放）；
scaleY(<number>)
使用[sy,1]缩放矢量执行缩放操作，sy为所需参数。
语法：
transform:scaleY(<number>);
举个栗子：
transform:scaleY(0.5);
transform:scaleY(50%);
3、scale(x,y)使元素水平方向和垂直方向同时缩放（x轴和y轴同时缩放）；
transform:scale(0.5,0.5);
transform:scale(50%，50%);
4、css3 skew() 扭曲或斜切
skew方法，指定对象skew transformation（斜切扭曲）。
三种情况：
skewX(x)仅使元素在水平方向扭曲变形（X轴扭曲变形）；
transform:skewX(10deg);
transform:skewX(-10deg);
skewY(y)仅使元素在垂直方向扭曲变形（Y轴扭曲变形）；
transform:skewY(10deg);
transform:skewY(-10deg);
skew(x,y)使元素在水平和垂直方向同时扭曲变形（X轴和Y轴扭曲变形）；
5、css3 matrix() 矩阵或混合
以一个含六值的（a,b,c,d,e,f）变换矩阵的形式指定一个2D变换。
相当于直接应用一个[a,b,c,d,e,f]变换矩阵。
语法：
transform:matrix(a,c,b,d,tx,ty);
参数说明：
tx,ty就是基于x和y坐标重新定位元素。
二、3D转换
1、css3 rotate3D()旋转
旋转rotateX
rottateX方法指定对象在X轴上的旋转角度
语法：
transform:rotateX(angle);
参数说明
angle表示旋转的角度。
举个栗子：
transform:rotateX(50deg);
旋转rotate
transform:rotate3d(x,y,z,angle);
2、css3 translate3D() 平移
移动translateZ
translateZ方法指定对象Z轴平移。
语法：
transform:translateZ(z);
移动translate3D
translate方法指定对象3D位移
语法：
transform:translate3d(x,y,z);
3、css3 scale3D() 缩放
缩放scaleZ
scaleZ方法指定对象的z轴缩放。
语法：
transform:scaleZ(z);
缩放scale3d
scale3d方法指定对象3D位移
语法：
transform:scale3d(x,y,z);
4、css3 matrix3D() 矩阵或混合
matrix3D方法以一个4*4矩阵的形式指定一个3D变换。
语法：
transform:matrix3d(sx,n,n,n,n,sz,n,n,n,n,sz,n,n,n,n,1);
参数说明：
使用16个值的4*4矩阵。
5、CSS3 perspective()
