空间：是从坐标轴角度定义的XYZ三条坐标轴构成了一个立体空间 Z轴位置与视线方向相同
空间转换
平移
属性：
- transform: translate3d(x,y,z);
- transform: translateX();
- transform: translateY();
- transform: translateZ();
取值：像素单位数值/百分比
默认情况下我们看不到Z轴的平移情况
视距
作用：指定了观察者与z=0平面的距离，为元素添加透视效果
透视效果：近大远小、近实远虚
属性：（添加给父级，取值范围800-1200）
perspective:视距;
<style>/*空间转换*/.father {perspective: 1000px;}.box {width: 200px;height: 200px;margin: 100px auto;background-color: blue;transition: all 0.5s;}.box:hover {transform: translateZ(-400px);}</style>
</head><body><div class="father"><div class="box"></div></div>
</body>
当鼠标悬停时，产生近大远小的效果，此时Z轴移动-400px
旋转
左手法则：
属性：根据旋转方向确定取值正负。左手握住旋转轴，拇指指向正值方向。其他手指弯曲方向为旋转正值方向
transform:rotateZ(值)
transform:rotateX(值)
transform:rotateY(值)
