transform 样式

1. 旋转（rotate）

        div {
            width: 200px;
            height: 200px;
            background-color: pink;
            margin: 100px auto;
            /* 三个方向旋转（只写其中一个也可以） */
            transform: rotateZ(45deg) rotateX(deg) rotateY(45deg);
        }
        /*
        rotateX: x轴旋转
        rotateY: y轴旋转
        */

2. 位移（translate）

transform :translateX(100px) translateY(100px)；
transform :translateY(100px)
transform :translateZ(100px)

3. 缩放（scale）

transform：scale（倍数）；/设置元素的缩放倍数/
倍数: 0~1之间, 缩小
倍数 : >1 , 放大

4. 倾斜(skew)

transform：skewX（45deg）

transform：skewY（45deg）

5. 变换基点

transform-origin： left top
方位值改变基点

transform-origin： 0px 0px
元素左上角