相关疑难解决方法(0)

Z-index低于文本但高于背景

我试图得到一个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)

html css z-index

3
推荐指数
1
解决办法
1878
查看次数

标签 统计

css ×1

html ×1

z-index ×1