3d,动画

3d功能函数： 3d位移
3d缩放
3d旋转
形成3d空间(让父元素形成3d空间、3d舞台)：
transform-style:preserve-3D
1.3d位移：
transform:translate3d(x,y,z);
transform:translateZ();
2.3D旋转：rotateZ();
rotate3d(x,y,z,度数) x y z 是矢量值，0不旋转 1旋转
3.3D缩放:scaleZ(); scale3d(x,y,z)
让背面不可见：backface-visibility:hidden;
4.景深：近大远小 perspective景深:值越大距离越远（给父元素添加）
5.景深的视角：prespective-origin:;中间center 左上角：left top right top
6.动画：
（1）.制作关键帧：@keyframes 动画名称{
from{left:0;}
to{left:500px;}
或@keyframes 动画名称{
0%{}
20%{}
50%{}
100%{}
（2）.调用关键帧：简写方式：animation:动画名称 动画时间 延迟时间 动画的类型 动画循环的次数（无限循环：infinite）动画运动的方向(reverse alternate 先正后反 alternate-reverse先反后正) 运动的状态:animation-plat-state:running pushed(暂停) 动画停止的状态：animation-fill-mode:forwards(停在最后一帧)；
动画的类型：linear匀速 ease 默认值 step-start:马上跳到动画每一结束帧的状态