css - 父元素显示在子元素之上

问题描述

问 题

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

解决方案

其实最简单的就是 给子元素 设置 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

这篇关于css - 父元素显示在子元素之上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！