2D转换之旋转rotate，2D转换中心点transform-origin及2D转换之缩放scale
目录
一.2D转换之旋转rotate
二.2D转换中心点transform-origin
三.2D转换之缩放scale
一.2D转换之旋转rotate
2D旋转指的是让元素在平面内顺时针旋转或逆时针旋转
1.语法
transform:rotate(度数）
2.重点
rotate里面跟度数，单位是deg 比如rotate(45deg)
角度为正时，顺时针，负时，为逆时针
默认旋转的中心点是元素的中心点
二.2D转换中心点transform-origin
我们可以设置元素转换的中心点
1.语法
transform-origin:X Y;
2.重点
注意后面的参数X和Y用空格 隔开
XY默认转换的中心点是元素的中心点（50% 50%）
还可以给x y设置像素或者方位名词（top bottom left right center）
三.2D转换之缩放scale
缩放就是可以放大和缩小，只要给元素添加上了这个属性就能控制它放大还是缩小
1.语法
transform:scale(x,y)
2.注意
其中的x和y用逗号隔开
transform:scale(1,1) 宽和高都放大一倍，相当于没有放大
transform:scale(2,2) 宽和高都放大2倍
transform:scale(2) 只写一个参数，第二参数则和第一个参数一样，相当于scale（2，2）
transform:scale(0.5，0.5) 缩小
scale缩放最大的优势：可以设置转换中心点缩放，默认以中心点缩放的，而且不影响其他盒子
四.2D转换综合写法
1.同时使用多个转换，其格式为：transform:translate() rotate() scale()...等
2.其顺序会影响转换的效果。（先旋转会改变坐标轴方位）
3.当我们同时有位移和其他属性的时候，记得要将位移放到最前
五.2D转换总结
1.转换transform 我们简单理解就是变形，有2D和3D之分
2.2D移动translate(x,y) 最大优势是不影响其他盒子，里面参数用%，是相对于自身宽度和高度来计算的
3.可以分开写translateX(x) 和 translateY(y)
4.2D旋转rotate(度数) 可以实现旋转元素 度数单位是deg
5.2D缩放scale(x,y) 里面参数是数字不跟单位 可以是小数 最大优势是不影响其他盒子
6.设置转换中心点trans-origin:x y; 参数可以百分比，像素或者是方位名词
7.当我们进行综合写法，同时有位移和其他属性的时候，记得要将位移放到最前