不起眼的z-index却能牵扯出这么大的学问_html/css_WEB-ITnose

z-index在日常开发中算是一个比较常用的样式，一般理解就是设置标签在z轴先后顺序，z-index值大的显示在最前面，小的则会被遮挡，是的，z-index的实际作用就是这样。

但是你真的了解z-index吗？你知道它有什么特性吗？这里先抛出几个名词：“ 层叠顺序（stacking order） ”，“ 层叠上下文（stacking context） ”，“ 层叠水平（stacking level） ”。

先说一下z-index的基本用法：　　

　　z-index可以设置成三个值：

auto，默认值。当设置为auto的时候，当前元素的层叠级数是0，同时这个盒 不会创建新的层级上下文（除非是根元素，即 ）； 。指示层叠级数，可以使负值，同时无论是什么值，都会创建一个新的层叠上下文； inherit。父元素继承

z-index只在定位元素中起作用 ，举栗子：

     #box1{        background: blue;        width: 200px;        height: 200px;    }    #box2{        background: yellow;        width: 200px;        height: 200px;        margin-top:-100px;    }        


      
查看更多关于不起眼的z-index却能牵扯出这么大的学问_html/css_WEB-ITnose的详细内容...
        

          
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://www.haodehen.cn/did111998