在css3中允许使用3D转换来对元素进行格式化，在原本只是2D转化的平面中引入了Z轴。在这之前我们讲解了css3中的2D转换，也就是二维空间变换，本篇的3D转换就是基于原来的2D转换而来，与2D转换的功能相似。
朝天ssl适用于网站、小程序/APP、API接口等需要进行数据传输应用场景，ssl证书未来市场广阔！成为创新互联的ssl证书销售渠道，可以享受市场价格4-6折优惠！如果有意向欢迎电话联系或者加微信：18982081108（备注：SSL证书合作）期待与您的合作！
相信学过数学的效果版对这一概念多多少少是知道的，我们要想有一个3D空间效果，也就是立体空间感，比如：正方体、长方体.....再比如我们生活所居住的房间也是3D立体空间的，主要有X轴、Y轴Z轴共同组成
x轴 ： 水平向右，x右边是正值，左边是负值。
y轴 ： 垂直向下，y下面是正值，上面是负值。
z轴 ： 垂直屏幕，往外面是正值，往里面是负值。
| 属性 | 描述 |
| transform | 使得元素向2D或3D转换 |
| transform-origin | 改变转换元素的位置 |
| transform-style | 规定被嵌套元素如何在 3D 空间中显示 |
| perspective | 规定 3D 元素的透视效果 |
| perspective-origin | 规定 3D 元素的底部位置 |
| backface-visibility | 定义元素在不面对屏幕时是否可见 |
这里transform属性和transform-origin属性在前一篇《有趣的transform形变》中已经讲解了，这里就不再细说。不同的是在3D转换中，transform-origin属性会接收第三个值，表示Z轴方向位置
transform-style设置元素的子元素是位于 3D 空间中还是平面中。
语法：
div{ transform-style: flat|preserve-3d; }