变形
使用translate让盒子水平垂直居中
<style>.fa{position: relative;}.son{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}</style>
过渡transition
<style>div{transition: transform 3s linear 2s;}</style>transition:被改变的属性值 运行时间 运行曲线 延迟时间
将具体被改变的属性改成all
<style>div{transition: all 3s linear 2s;}</style>all:过渡所有被改变的属性
## 动画
设定动画
<style>@keyframes 动画名称{}</style>
添加动画
div{animation: play 3s linear infinite forwards}animation: 动画名称 时间 速度曲线 次数 是否逆向
速度曲线：ease默认 linear
次数：infinite 无限次
逆向播放：alternate（逆向） nomal（不逆向） forwards
forwards 规定动画结束后不回到起点（停留在终点）
backwards 规定动画结束以后停留在起点
animation-play-state：paused
改变动画状态 paused（暂停动画）
