2D转换：
        1）旋转 rotate
        2）转换中心
        3）缩放

动画：
        1）使用步骤
        2）属性



2D转换：
        1）旋转
                transform: rotate(度数) 如transform: rotate(30deg)
                正数为顺时针，负数为逆时针
                默认旋转中心点是元素的中心点
        2）转换中心
                transform-origin: 50% 50% 默认元素中心点
                transform-origin:top left = transform-origin: 0 0 左上角
                transform-origin: 50px 50px 距离左上角50px 50px位置
        3）缩放 scale
                scale(宽的倍数，高的倍数)
                transform:scale(2,3)
                优势  以中心点缩放 不影响其他盒子
        4）综合写法
                transform:translate() rotate() scale()


动画：
        1）使用步骤
                a: 现在css中定义动画 （动画序列，各个状态时的样式）
                b: 给目标元素使用动画
        2）属性
                必须属性
                动画名 animation-name:
                持续时间 animation-duration: 3s
                可选属性
                速度曲线        animation-timing-function: ease/linear/steps
                延迟时间        animation-delay: 0s
                执行次数   animation-iteration-count: 2   infinite为无限循环
                逆向播放：倒车
                结束状态：一去不复返 animation-fill-mode: forwards
                暂停动画： 和鼠标悬停hover一起使用
                        animation-play-state:paused;
                        【注意：这个属性跟无限播放和逆向播放是冲突】
        3）综合写法
                animation: name duration timing-function delay iteration-count direction fill-mode;

2D转换：
        1）旋转 rotate
        2）转换中心
        3）缩放

动画：
        1）使用步骤
        2）属性



2D转换：
        1）旋转
                transform: rotate(度数) 如transform: rotate(30deg)
                正数为顺时针，负数为逆时针
                默认旋转中心点是元素的中心点
        2）转换中心
                transform-origin: 50% 50% 默认元素中心点
                transform-origin:top left = transform-origin: 0 0 左上角
                transform-origin: 50px 50px 距离左上角50px 50px位置
        3）缩放 scale
                scale(宽的倍数，高的倍数)
                transform:scale(2,3)
                优势  以中心点缩放 不影响其他盒子
        4）综合写法
                transform:translate() rotate() scale()


动画：
        1）使用步骤
                a: 现在css中定义动画 （动画序列，各个状态时的样式）
                b: 给目标元素使用动画
        2）属性
                必须属性
                动画名 animation-name:
                持续时间 animation-duration: 3s
                可选属性
                速度曲线        animation-timing-function: ease/linear/steps
                延迟时间        animation-delay: 0s
                执行次数   animation-iteration-count: 2   infinite为无限循环
                逆向播放：倒车
                结束状态：一去不复返 animation-fill-mode: forwards
                暂停动画： 和鼠标悬停hover一起使用
                        animation-play-state:paused;
                        【注意：这个属性跟无限播放和逆向播放是冲突】
        3）综合写法
                animation: name duration timing-function delay iteration-count direction fill-mode;