第二十二章 3D转换模块



  
    
    3D转换
    
  
  
    

    

    

第180课 3D转换模块

2D就是一个平面,只有宽度和高度,没有厚度
3D就是一个立体,有宽度和高度,还有厚度
默认情况下所有的元素都是2D展现

和透视一样,想看到某个元素的3D效果,只需要给他的 父元素 添加一个transform-style属性,
然后设置为preserve-3d即可 transform-style: preserve-3d;

第181课 3D转换模型-正方体上

练习看代码

第182课 3D转换模型-正方体下

上下前后,90 180 270 360 z100px

第183课 3D转换模型-长方体

添加scale(2,1)即可得到长方体

第184课 3D转换模型-练习

只要父元素被拉伸了,子元素也会被拉伸

第185 - 186 课 3D播放器

注意点

1、动画中如果有和默认样式中同名的属性,会覆盖默认样式中同名的属性
2、在编写动画的时候,固定不变的值写在前面,需要变化的值写在后面

你可能感兴趣的:(第二十二章 3D转换模块)