transform-style用于设置是否将子元素放在三维空间内。transform-style: preserve-3d表示将子元素放进三维空间,渲染时会计算各个子元素在三维空间中的关系,比如各种遮盖、交错等空间关系,像这样: 之前在一个项目使用这个属性时,无论怎么设置,都是flat的效果,不保留三维空间的关系,像这样: 经过一番对比和调试后发现,是...
transform-style属性也是3D效果中经常使用的,其两个参数,flat|preserve-3d. 前者flat为默认值,表示平面的;后者preserve-3d表示3D透视。 preserve-3d符合我们真实世界的思维认识。比方说,你让妹子右转了45度,此时妹子脑袋左转45度想你吐舌卖萌,妹子的脸蛋应该和你是面对面平行的。 应用transform-style: preserve-3d声明...