0

これは私のコードです:

HTML

<div class="item">
    &nbsp;
</div>

<div class="item">
    <div class="item-abs">
        &nbsp;
    </div>
</div>

<div class="item">
    &nbsp;
</div>​

CSS

.item
{
    position:relative;
    z-index:5;
    float:left;
    background-color:red;
    width:100px;
    height:100px;
    margin:10px;
}

.item-abs
{
    position:absolute;
    top:0px;
    left:40px;
    z-index:500;
    background-color:blue;
    width:100px;
    height:100px;    
}
​

ご覧のとおり、子が 500 の z-index を持っている場合、次の親の下にあります。子の z-index を強制する方法はありますか? 父親のスタックに乗る？それとも、このシナリオは実行できませんか?

親のz-indexを変更できず、javascriptで適切な降下z-indexを設定せずにやりたいのですが...

4

2 に答える 2

3

確かに、子のz-indexを設定する必要はありません。

最後のdivのz-indexを低いz-indexに設定するだけで、完了です。

例

この動作の理由は次のとおりです。親が同じz-indexを持っている場合、DOMの最後に来るものが「勝ち」ます。したがって、技術的にはz-index:1、絶対的な子を持つ親の単純なもので十分です。他の可能性は、子だけにz-indexを設定することです。

例

于 2012-10-15T14:57:58.113 に答える
0

次のフィドルはあなたが望むことをしているようです（私は信じています）：

http://jsfiddle.net/BhQNr/3/

これは、親要素の配置を削除し、子要素を相対的にすることによって行われます (absolute で機能しますが、絶対を使用する場合よりも左と上の値が近くなります)。

于 2012-10-15T14:53:00.220 に答える