是否有可能有一个孩子有较高的Z指数比其父

Question

代码片段：

<div class="parent"> 
    <div class="child"> 

    </div> 
</div> 

<div class="other"> 

</div> 

我想要做的是有其他类渲染父以上但低于孩子是这可能吗？

Answer 1

.parent { 
 
    width: 300px; 
 
    height: 300px; 
 
    background-color: #F4F4F4; 
 
} 
 

 
.child { 
 
    width: 200px; 
 
    height: 200px; 
 
    background-color: red; 
 
    border: 4px solid #000; 
 
    opacity: .9; 
 
    
 
    position: relative; 
 
    z-index: 2; 
 
} 
 

 
.other { 
 
    width: 150px; 
 
    height: 150px; 
 
    background-color: green; 
 
    border: 4px solid #000; 
 
    opacity: .9; 
 
    
 
    position: absolute; 
 
    top: 150px; 
 
    z-index: 1; 
 
}

<div class="parent"> 
 
    <div class="child"> 
 

 
    </div> 
 
</div> 
 

 
<div class="other"></div>