课程
/前端开发
/HTML/CSS
/CSS深入理解之z-index
请问设置了定位属性的元素是不是就具有了z-index:auto的属性??
还有为什么.box的z-index:0不应该是在z-index:-1之上吗?
2016-04-14
源自:CSS深入理解之z-index 5-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实践经验分享
3 回答求解,我这里设置里了z-index:0;之后并没有向老师那样的效果
4 回答求助!!!!!!!!!!!!!!!!!!!!!!
3 回答视频中inline-block与block元素的层叠顺序如何理解
3 回答该如何理解父元素设置position后不会覆盖img,而img的兄弟元素设置position后会覆盖img?如何从z-index层面理解?
2 回答这里的层叠水平是后面一节的层叠顺序里的那一阶一阶的水平吗