3. 2D转换中心点我们可以设置元素转换的中心点
语法:transform-origin(X Y)转换中心点
重点:注意后面的参数X和Y的值与值之间用空格隔开
还可以给X Y设置像素或方位名词(top上, bottom下, center中, left左, right右)
默认是(X 50% Y 50%)。
4. 2D转换之缩放(scale)
缩放顾名思义,可以放大和缩小,
语法:transform:scale(X,Y); 注意:X表示宽,Y表示高,里面的数字不跟单位就是倍数,
放大和缩小:transform:scalecl(1,1)宽和高都放大一倍(默认),
放大:transform:scalecl(2,2)宽和高都放大二倍,
缩小:transform:scalecl(0.5,0.5)宽和高都缩小,
缩放的最大优势:可以设置转换中心点缩放,他在缩放的时候不会影响其他盒子(可以看成他飞起来了)
5.接前面几个2D转换属性的综合写法:
注意:其顺序会影响转换的效果(先旋转会改变坐标轴的方向)
当我们同时有位移和其他属性的时候记得将移动放最前。