空间转换
空间：
是从坐标轴角度定义的。 x 、y 和z三条坐标轴构成了一个立体空间，z轴位置与视线方向相同。
空间转换也叫3D转换
属性：transform
空间转换.png
空间位移
语法
transform: translate3d(x, y, z);
transform: translateX(值);
transform: translateY(值);
transform: translateZ(值);
取值（正负均可）
像素单位数值
百分比
空间转换-空间位移.png
透视效果
使用perspective属性实现透视效果
属性（添加给父级）
perspective: 值
取值：像素单位数值， 数值一般在800 – 1200。
作用：空间转换时，为元素添加近大远小、近实远虚的视觉效果
透视效果.png
空间旋转
使用rotate实现元素空间旋转效果
语法
transform: rotateZ(值);
transform: rotateX(值);
transform: rotateY(值);
左手法则：
判断旋转方向: 左手握住旋转轴, 拇指指向正值方向, 手指弯曲方向为旋转正值方向
空间旋转-左手法则.png
动画
使用animation添加动画效果
-
定义动画
定义动画.png
2.调用动画
使用动画.png
使用动画2.png
动画属性
注意：
动画名称和动画时长必须赋值
取值不分先后顺序
如果有2个时间值，第一个时间表示动画时长，第二个时间表示延迟时间
动画属性.png
动画属性-使用过程.png
：使用steps实现逐帧动画
动画复合属性.png
