Question

我有一个元素将自己（以及所有孩子的扩展名）放在相应部分的背景后面。我没有在页面上的任何其他元素，甚至在同一部分中遇到此问题。我在它上面设置了背景颜色，以确保正在发生的事情。它发生在所有浏览器中。感谢您提供的任何帮助。

<div id="homepage_servicesstrip">
    <div id="homepage_web_drops_wrap" style="background-color:red;">
    </div>
</div>

    #homepage_servicesstrip {
        background:url('home/images/gradient-services-background.png');
        background-size: auto 100%;
        position:absolute;
        margin-top:0px;
        width:100%;
        height:1050px;
        z-index:1;
    }
    #homepage_web_drops_wrap {
        position:absolute;
        margin-top:60%;
        margin-left:10%;
        height:500px;
        width:80%;
        z-index:60;
    }

Answer 1

首先计算兄弟姐妹的z指数，然后计算儿童的z指数。例如 HTML

<div class="box">
    <div class="one box"></div>
</div>
<div class="box">
    <div class="two box"></div>
</div>
<div class="box">
    <div class="three box"></div>
</div>

CSS

   .box {
       z-index:1;
   }
   .two {
       z-index:1000000;
    }

.two不会高于.three，因为.three's父级高于.two's父级。

DEMO

背后的元素？

1 个答案: