Weicong
2016-04-14 21:03
请问设置了定位属性的元素是不是就具有了z-index:auto的属性??
还有为什么.box的z-index:0不应该是在z-index:-1之上吗?
层叠上下文。只是针对子元素器作用的。 2个图片兄弟元素。都这是z-index=3都是层叠上下文。后来居上原则ok
层叠上下文的border 和背景在最下面。那第一张图片按理说不应该被第二种图片的背景(箭头指示挡住啊。)这是我一开始的错误立即理解。所以说层叠上下文这个比较的概念指示针对子元素和父元素比较用的到
因为默认的z-index:auto并不会有层叠上下文,所以.box不设置z-index:0时,没有层叠上下文,是一个普通元素,而负值的z-index只会比有层叠上下文的background/border层级高,所以自然就没有.box层级高,所以被覆盖了;
而当设置了.box z-index:0时,.box就有了层叠上下文,background也就是有层叠上下文的background,因此它的层级会比z-index:-1要低,所以被图片覆盖了。
不知道这样你能不能懂。
设置了定位,z-index默认是auto,前提没设置z-index。
当.box设置z-index后就创建了层叠上下文,background是在负z-index之下的。如果.box中有个图片的话这个图片会在z-index:-1的图片之上
<div id="header"> <div class="page-container" id="nav"> <div id="logo" class="logo"><a href="/" target="_self" class="hide-text">
设置定位的话,元素会有z-index,如果不设置z-index的值,默认是auto。box的z-index比较是在一个层叠上下文中比较的
CSS深入理解之z-index
40882 学习 · 31 问题
相似问题