课程
/前端开发
/HTML/CSS
/CSS深入理解之z-index
图片并没有覆盖有背景的div元素
2016-04-30
源自:CSS深入理解之z-index 5-1
正在回答
你想要实现img覆盖div背景的效果,应该把你的HTML结构改为div里面嵌套img即可
你这个代码写的是container、img都各自创建了一个层叠上下文,但是他们的父元素的层叠上下文都属于根标签,这样container和img都属于兄弟级别的元素,而container的z-index高于img,所以会覆盖img。老师讲的应该是img和父元素wrap之间的z-index设置。如果你将父元素的z-index设置为0,就会发现wrap被图片覆盖。因为此时img的层叠上下文不是根标签,而是wrap,wrap就变成了background,所以img的index:-1高于background,会覆盖掉wrap。
肯定的呀,你div z-index的层级高于 img元素呀,img怎么会覆盖div元素呢
举报
CSS技术大牛深入理解系列又一力作,z-index实践经验分享
1 回答老师,根元素的z-index是等于0吧?
3 回答该如何理解父元素设置position后不会覆盖img,而img的兄弟元素设置position后会覆盖img?如何从z-index层面理解?
1 回答z-index干嘛用的
4 回答z-index问题
2 回答z-index 嵌套的问题