我试图得到一个div作为部分背景显示在内联内容下面是包含div但高于其容器的背景.如果我将仅部分背景的z-index设置为-1,它将显示在背景后面.但是,如果我将包含div的z-index设置为1,而包含的div的z-index为-1,则会根据需要显示.
有人可以向我解释为什么会这样,如果这是一个可靠的方法?
.container {
position: relative;
width: 80%;
height: 18px;
padding: 6px 10px;
background: #666;
z-index: 1;
}
.partialbg {
position: absolute;
left: 0px;
top: 0px;
height: 30px;
width: 80%;
background: #0CC;
z-index: -1;
}Run Code Online (Sandbox Code Playgroud)
<div class="container">Text here
<div class="partialbg"></div>
</div>Run Code Online (Sandbox Code Playgroud)