语法:
transform:rotate(旋转)|scale(缩放)|skew(倾斜)|translate(位移);注:当多种变形方式综合在一起时，用空格隔开
1.rotate旋转(X/Y/Z必须为大写)
①rotateX(30deg)沿X轴翻转30deg等价于rotate3d(1,0,0,30deg)
3d空间的沿X轴翻转
②rotateY(30deg)沿Y轴翻转30deg等价于rotate3d(0,1,0,30deg)
3d空间的沿Y轴翻转
③rotateZ(30deg)沿Z轴翻转30deg等价于rotate3d(0,0,1,30deg)
3d空间的沿Z轴翻转
④rotate(45deg)当不指定轴时，相当于2d空间的旋转，正值为顺时针，负值为逆时针
注:设置旋转变形时，单位deg
2.scale缩放
①scaleX(1.5)沿X轴放大或缩小，大于1为放大，小于1为缩小
②scaleY(0.5)沿Y轴放大或缩小
③scale(1.5)X轴，Y轴同时放大或缩小
④scale(-1.5)先翻转再缩放
3.skew倾斜(扭曲)
①skewX(30deg)沿X轴倾斜
②skewY(-30deg)沿Y轴倾斜
③skew(30deg)不指定轴时，默认沿X轴倾斜
④注:下方两种写法倾斜效果不同
(a)skew(30deg,30deg)X轴，Y轴同时倾斜
(b)skewX(30deg)skewY(30deg)X轴，Y轴同时倾斜
注:倾斜单位角度(deg)
4.translate位移
①translateX(100px)沿X轴位移，向右为正，向左为负
②translateY(-100px)沿Y轴位移，向下为正，向上为负
③translateZ(100px)沿Z轴位移，向前为正，向后为负
注:当设置沿Z轴的位移时，需要给本元素或父元素设置透视值
④translate(100px)不指定轴时，默认沿X轴位移
⑤translate(1000px,100px)X轴和Y轴同时位移
translateX(100px)translateY(100px)X轴和Y轴同时位移
