transform 改变
rotate 旋转
translate 位移
scale 缩放
记得兼容性：
-webkit-
-moz-
-ms-
-o-
transform: rotate(Xdeg,Ydeg);
deg 表示角度 X轴正半轴为0deg，顺时针旋转值越来越大。
transform-origin( X ,Y ); 设置对象旋转的中心点，如果没设置该值，默认transform-origin(50%,50%);
transform-origin(100px,200px); 设定旋转的中心点为，水平位移100px，垂直位移200px;
transform: rotate(45deg); 对象 以水平位移100px,垂直位移200px 为中心点旋转45度。
默认旋转中心为对象的正中心，即：图片长宽的50%。transform-origin:50% 50%;
rotate指定对象的2D旋转，指定对象指的是当前对象，也就是原元素，虽然子元素也会跟着动，
但是子元素并没有发生相对旋转，旋转一定要有一个旋转中心，所以需先有transform-origin属性的定义来确定旋转中心，
如果缺省，默认为transform-origin: 50% 50%。
transform:translate(X , Y); px,vh,vw,%,rem,em,cm,mm等相对单位，绝对单位都有效。
X 相对图片左上角顶点，进行水平位移。
Y 相对图片左上角顶点，进行垂直位移。
transform: translate(200px); === transform: translate(200px,0);
transform: translate(0,200px); 如果只让Y轴垂直位移，那么X轴参数不能省略。
只写一个参数那么默认X轴水平位移200px，Y轴不进行位移。
transform:translateX(x);
transform:translateY(x);
transform: scale( X , Y );
以对象的正中心为缩放中心，把对象进行缩放，这里是等比例缩放，对象不会变形，缩放对象包括图片，div等等。
transform: scaleX( .5 ); 以对象的正中心为中心，水平缩放到宽度等于原来宽度的50%；
transform: scaleY( .5 ); 以对象的正中心为中心，垂直缩放到高度等于原来高度的50%；
transform: scale( .5 , .5 ); 以对象的正中心为中心，水平垂直缩放到原来宽高的50%；
transform: scale( .5 ); === transform: scale( .5 , .5 );
=================
transform: rotate(Xdeg,Ydeg);
deg 表示角度 X轴正半轴为0deg，顺时针旋转值越来越大。
transform-origin( X ,Y ); 设置对象旋转的中心点，如果没设置该值，默认transform-origin(50%,50%);
transform-origin(100px,200px); 设定旋转的中心点为，水平位移100px，垂直位移200px;
transform: rotate(45deg); 对象 以水平位移100px,垂直位移200px 为中心点旋转45度。
默认旋转中心为对象的正中心，即：图片长宽的50%。transform-origin:50% 50%;
rotate指定对象的2D旋转，指定对象指的是当前对象，也就是原元素，虽然子元素也会跟着动，
但是子元素并没有发生相对旋转，旋转一定要有一个旋转中心，所以需先有transform-origin属性的定义来确定旋转中心，
如果缺省，默认为transform-origin: 50% 50%。
transform:translate(X , Y); px,vh,vw,%,rem,em,cm,mm等相对单位，绝对单位都有效。
X 相对图片左上角顶点，进行水平位移。
Y 相对图片左上角顶点，进行垂直位移。
transform: translate(200px); === transform: translate(200px,0);
transform: translate(0,200px); 如果只让Y轴垂直位移，那么X轴参数不能省略。
只写一个参数那么默认X轴水平位移200px，Y轴不进行位移。
兼容性问题：
-webkit-
-moz-
-ms-
-o-
----------------------------
transform:translateX(x);
transform:translateY(x);
transform: scale( X , Y );
以对象的正中心为缩放中心，把对象进行缩放，这里是等比例缩放，对象不会变形，缩放对象包括图片，div等等。
transform: scaleX( .5 ); 以对象的正中心为中心，水平缩放到宽度等于原来宽度的50%；
transform: scaleY( .5 ); 以对象的正中心为中心，垂直缩放到高度等于原来高度的50%；
transform: scale( .5 , .5 ); 以对象的正中心为中心，水平垂直缩放到原来宽高的50%；
transform: scale( .5 ); === transform: scale( .5 , .5 );