父元素显示在子元素之上

不重构html,有没有办法让块级父元素显示在块级子元素之上呢(覆盖)?

阅读 10k
3 个回答

其实最简单的就是 给子元素 设置 positon:relative;z-index:-1; 也不影响父元素布局

css布局的7阶层叠顺序

层叠上下文 background/border
负z-index
block块状水平盒子
float浮动盒子
inline/inline-block水平盒子
z-index:auto或者可以看成z-index:0
正z-index

越往下优先顺序越高。
可以看到,一个元素设置z-index为负数可以让其尽可能“被覆盖”。
z-index生效的先决条件是postion非 static

父元素position: relative;子元素position: absolute;z-index: -1,是一种解决方案

如楼上所说,可以做到,但是同样父元素也会脱离当前的文档流,即布局定位会出现变化。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题