2D功能函数

Posted 2021-03-02 yh-3175339026

一、2D功能函数：

1）2D位移：

①transform:translate(x,y);

②transform:translateX(x轴移动的距离);

③transform:translateY(Y轴移动的距离);

2）2D的缩放：

①transform:scale(x,y);

②transform:scaleX();

③transform:scaleY();

注： x ， y  这两个参数为一个系数，大于1时放大 ，小于1时缩小。

3）2D的旋转：

①transform:rotate(30deg);

②transform:rotateX(30deg);

③transform:rotateY(30deg);

4）2D的倾斜：

①transform:skew(度数);

②指定x,y的倾斜：

    transform:skewX(度数)

    transform:skewY(度数)

5）改变变形原点：

①transform-origin:x y;

②属性值：

　　left top

　　10px 20px

　　10%  20%

补：多个功能函数共同使用的情况下，尽量先写位移后写其他的功能函数。