css3的3D设置--由慕课网讲解

一、创建3D场景用到：perspective与perspective-origin：

perspective：800;

perspective-origin:50% 50%;

借用慕课网老师的图：

其中，perspective指的是浏览器窗口（就是电脑屏幕）与三维物体的距离，perspective-origin指的是视点在浏览器窗口上的位置。

用transform对3D物体进行操作，因为二维操作也有transform，所以用transform-style:perspective-3d告诉浏览器是3D操作。借用慕课网老师的图：

二、实际使用：

<div class="stage">    <div class="object"></div></div>

先设置外层3D环境，再设置3D物体本身的样式与变化。

三、总结：1）样式上：perspective，perspective-origin，transform-style这三个属性的使用；2）结构上：外层环境+物体3D物体本身。