「这是我参与11月更文挑战的第25天，活动详情查看：2021最后一次更文挑战」
在上文中，我们介绍了transform的一些属性，但是没有说完，今天来补充补充
下面是3d变换相关的属性函数
-
transform:translate3d()
必须设置3个值，分别是X轴平移量、Y轴平移量和Z轴方向的平移量 -
transform: translateZ()表示单独设置在z轴上的平移 -
transform: rotate3d()表示3D旋转角度，其中前3个参数分别表示旋转的方向x,y,z，第4个参数表示旋转的角度，参数不允许省略 -
transform: rotateX()表示在x轴的旋转角度 -
transform: rotateY()表示在y轴的旋转角度 -
transform: rotateZ()表示在z轴的旋转角度 -
transform: scale3d()表示3d缩放，接收三个参数分别对应x，y，z轴的缩放比例系数 -
transform: scaleZ()表示设置z轴方向上的缩放系数 -
transform: perspective()表示景深
在我们CSS3中，perspective用于激活一个3D空间，属性值就是景深大小（默认none无景深），景深就是我们的肉眼距离显示器的距离，景深越大，元素离我们越远，效果就不好。所以应用景深的元素称为“舞台元素”
注意：默认值是none，可以设置为一个长度值，这个长度是沿着Z轴距离坐标原点的距离。若使用perspective()函数，那么他必须被放置在transform属性的首位，如果放在其他函数之后，则会被忽略
-
transform-origin属性用于设置以某个原点进行转换
可以传递两个或者一个参数
如果提供两个时，第一个用于横坐标，第二个用于纵坐标。
如果只提供一个，该值将用于横坐标；纵坐标将默认为50%。
取值可以是：
%
<length>
left
center
right
top
center
bottom -
transform-style属性用于指定某元素的子元素是（看起来）位于三维空间内，还是在该元素所在的平面内被扁平化。
取值：
flat：指定子元素位于此元素所在平面内
preserve-3d：指定子元素定位在三维空间内 -
perspective：none | <length>
设置在父元素上，对后代元素其作用（在子元素中也可以使用transform: perspective()这种写法）
指定观察者与「z=0」平面的距离，使具有三维位置变换的元素产生透视效果。「z>0」的三维元素比正常大，而「z<0」时则比正常小，大小程度由该属性的值决定。 -
同
perspective属性，也是设置在父元素上，对后代元素起作用。 这个属性来设置你在X,Y轴坐标确定的那个点来看这个元素，Z轴是被perspective属性设置的 -
backface-visibility表示背面面向用户时是否可见visible：指定元素背面可见，允许显示正面的镜像。
hidden：指定元素背面不可见
