transform 属性向元素应用 2D 或 3D 转换。该属性允许我们对元素进行旋转、缩放、移动或倾斜
2D转换
translate():根据左(X轴)和顶部(Y轴)位置给定的参数,从当前元素位置移动
rotate():在一个给定度数顺时针旋转的元素,负值表示元素逆时针旋转
scale():该元素增加或减少的大小,取决于宽度(X轴)和高度(Y轴)的参数
skew():包含两个参数值,分别表示X轴和Y轴倾斜的角度,如果第二个参数为空,则默认为0,参数为负表示向相反方向倾斜
natrix():将前面四个方法合为一个,用矩阵来表示2d转换
transform-origin():1、用来控制转换原点
2、默认值为(50%,50%)表示元素的中心点作为转换原点
3、除了使用固定值和百分比,还可以用bottom,top,center,left,right来控制原点
3D转换
与2d转换原理一样,只是在x,y的基础上增加了z轴的转换