主页 / 问题 / 969223
Accepted
Raz Galstyan
Asked:2020-04-13 21:59:58 +0000 UTC2020-04-13 21:59:58 +0000 UTC

z-index 的问题

  • 772

使用绝对定位覆盖元素存在问题。

这是一个例子。

.d1,.d2{
  width: 100%;
  height: 100px;
  margin-bottom: 30px;
  position:relative;
  z-index: 1;
  background: green;
}
.subdiv{
  position:absolute;
  z-index: 2;
  width: 50px;
  height: 200px;
  top: 30%;
  left: 50%;
  background: red;
}
<div class="d1">
    <div class="subdiv"></div>
</div>
<div class="d2"></div>

问题是由于第二个元素为՝class="d2"՝， divcclass="subdiv"不可见。

这个问题怎么解决。

笔记：

z-index: 1;我的积木class="d1"和class="d2".

html

1 个回答

  1. Best Answer

    .d1,.d2{
  width: 100%;
  height: 100px;
  margin-bottom: 30px;
  position:relative;
  z-index: auto;
  background: green;
}
.subdiv{
  position:absolute;
  z-index: 9999;
  width: 50px;
  height: 200px;
  top: 30%;
  left: 50%;
  background: red;
}
    <div class="d1">
    <div class="subdiv"></div>
</div>
<div class="d2"></div>

    • 2

相关问题