CSS 3D

CSS 3D

++原理++

CSS 3D并非真的3D，只是利用计算的方法，借由浏览器的高效能，在2D的空间绘制一个3D的图形，就像我们拿张纸，用铅笔在上头画个正立方体之类的。

3d场景的每一个面就是一个div。首先确立好中心点，然后通过设置每个div的css属性（即旋转+位移），将其设置到指定的位置，这样，就能画出各种立方体。

++属性++

• transform
  

  该属性能让你修改 CSS 可视化模型的坐标空间，其中包括 平移（translate）、旋转（rotate）、缩放（scale） 和 扭曲（skew）。

• transform-style

  用于指定其为子元素提供 2D 还是 3D（preserve-3d） 的场景。另外，该属性是非继承的,所以对于中间节点需要显式设定（transform-origin: 50% 50% 0px）。

  该属性指定了其子元素是处于 3D 场景还是 2D 场景。对于 2D 场景，元素的前后