针对transform这个css属性进行讲解，有些属性还没有用到的或者暂时还不是很理解的，就先空着，等到真正理解了再进行补充
transform
允许 旋转、缩放、倾斜、平移给定元素
旋转
rotate(degree)
旋转需要确定一个旋转中心，transform-origin属性确定旋转中心
如果设置的值为正数，表示顺时针旋转
如果设置的值为负数，表示逆时针旋转
transform:rotate(30deg)
缩放
scale：X轴和Y轴等值缩放
scaleX：仅缩放X轴
scaleY：仅缩放Y轴
值可以为负数，如果为负数，会先将元素反转再缩放
transform:scale(2,1.5)
倾斜
skew(x,y)：倾斜x轴和y轴
skewX：仅倾斜x轴
skewY：仅倾斜y轴
transform:skew(30deg,10deg)
平移
translate(x,y)：水平方向和垂直方向同时移动
translateX()：仅水平方向移动
translateY()：仅垂直方向移动
transform:translate(100px,20px)
透视
perspective
暂时还没用到
呈现样式
transform-style
值： flat | persevere-3d
flat：所有子元素在 2D 平面呈现
persevere-3d：保留3D空间
变形中心
transform-origin
1）关键字
top left-> (0%, 0%）
top right -> (100%, 0%)
bottom left -> (0, 100%)
bottom right -> (100%, 100%)
top | top center | center top -> (50%, 0)
left | left center | center left -> (0, 50%)
right | right center | center right -> (100% ,50%)
bottom | bottom center | center bottom -> (50%, 100%)
- 数值
transform-origin(50px, 50px)
百分值是相对于自身而定
