展示页效果

学习妙味课堂的展示页效果

效果预览：展示页

知识点预备：

【1】transform-style属性

transform-style属性指定了它的子元素看起来是存在3D空间中，还是存在2D空间中，如果存在2D空间中，则它的子元素不能存在3D中。

注意：因为该属性不会被（自动）继承，所以必须为元素所有非叶后代节点设置该属性。

语法：transform-style: flat | preserve-3d

preserve-3d指定子元素定位在三维空间内

flat指定子元素位于此元素所在平面内。

【2】perspective属性

MDN官方文档说明：

perspective 属性指定了观察者与z=0平面的距离，使具有三维位置变换的元素产生透视效果。z>0的三维元素比正常大，而z<0时则比正常小，大小程度由该属性的值决定。

举栗子：

<style>  2  #wrap{  3  4  position: relative
        		
延伸阅读
        		

        			
        			
ssh框架
        			2016-09-30
        			
        			
        			
        			
阿里移动安全 [无线安全]玩转无线电——不安全的蓝牙锁
        			2017-07-26
        			
        			
        			
        			
消息队列NetMQ 原理分析4-Socket、Session、Option和Pipe
        			2024-03-26
        			
        			
        			
        			
Selective Search for Object Recognition 论文笔记【图片目标分割】
        			2017-07-26
        			
        			
        			
        			
词向量-LRWE模型-更好地识别反义词同义词
        			2017-07-26
        			
        			
        			
        			
从栈不平衡问题 理解 calling convention
        			2017-07-26
        			
        			
        			
        			
php imagemagick 处理 图片剪切、压缩、合并、插入文本、背景色透明
        			2017-07-26
        			
        			
        			
        			
Swift实现JSON转Model - HandyJSON使用讲解
        			2017-07-26
        			
        			
        			
        			
阿里移动安全 Android端恶意锁屏勒索应用分析
        			2017-07-26
        			
        			
        			
        			
集合结合数据结构来看看(二)
        			2017-07-26
        			
        			
        			
        		
        		
        		学习是年轻人改变自己的最好方式