如何用z-index将孩子放在父母的后面？

问题描述

我有这个题目中描述的问题，不能把 child_child 放在所有其他父母后面？

Jsfiddle

解决方案

仅为最后一个孩子设置 z-index 并移除浮动，将其修改为相对定位：

CSS：

  .big {
 position：relative; 
背景颜色：红色; 
 width：420px; 
 height：100px; 
} 
 .small {
 position：absolute; 
 background-color：blue; 
 top：10px; 
 left：10px; 
 width：400px; 
 height：150px; 
} 
 .child_child {
 position：absolute; 
 background-color：yellow; 
 top：10px; 
 width：400px; 
 height：180px; 
 z-index：-1; 
} 
  

在主浏览器中检查 - 确定。

I have this problem as described in the title, can't put the child_child behind all other parents?

is this possible? Jsfiddle

解决方案

Set z-index only for last child Fiddle and remove floating, change fixed to relative positioning:

CSS:

.big {
    position: relative;
    background-color:red;
    width:420px;
    height:100px;
}
.small {
    position:absolute;
    background-color:blue;
    top:10px;
    left: 10px;
    width:400px;
    height:150px;
}
.child_child {
    position:absolute;
    background-color:yellow;
    top:10px;
    width:400px;
    height:180px;
    z-index:-1;
}

Checked in main browsers - OK.

这篇关于如何用z-index将孩子放在父母的后面？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！