空间转换和动画
语法：transform:translate3d(x,y,z)；
取值：像素值或者百分比
透视
属性（给附有3d属性的最近一级父级添加）视距（400px~1200px一般）：
perspective：数值px； （pp）
赋予近大远小，近实远虚的效果
安排一个眼睛在一个距离（视距）看看屏幕
当视距=位移量会闪屏，在到达同数值后丢失然后又hover住，导致连闪。
空间旋转
左手法则（握拳）拇指向着轴正方向，其余手指就指向旋转正方向
属性名： transform：rotateX/Y/Z(数值deg)
立体呈现
transform-style： preserve-3d；（给附有3d属性的最近一级父级添加，和pp一样；）给予其子元素3d环境。
动画的实现步骤
！定义动画------------------------
@keyframes 动画名称 {
from { } 起始状态
to { } 最终状态
}
！使用动画-----------------------
属性名： animation： 动画名称 花费时长
如果动画的起始和目标初始状态一样，from可以省略。
可以用 数值% 表示阶段性的变化。
@keyframes two {
50% {width: 700px;height: 100px;}
100% {width: 800px;height: 500px;}
注意点
1.动画名称不能为running，否则动画效果不生效。
2.动画名称不能重复。
3.一次动画完成后默认会突然一下回到初始状态
连写 animation：
动画名称
动画时长
速度曲线 linear匀速////steps(数字)分段
延迟时间 数字+s
重复次数 或者infinite
动画方向 alternate交替播放
执行完毕时状态 forwards （forwards不能和infinite共用）
animation-play-state： paused； 鼠标指上去暂停
animation-time-
一个盒子调用多个动画用（，）逗号隔开
轮播图
利用障眼法，复制最初的视觉效果图到结束的部分再重播
