css z-index question

Question

初心者からZ-indexへ私はfrontBoxの背後にbackleftBoxとbackrightBoxを配置したいが、私のコードは機能していないようだ。

<style type="text/css"> 
    #frontBox{ width: 400px; height: 500px; margin: 0 auto; background-color: #ccc; position: relative; z-index: 99;} 
    #backleftBox{ width: 90px; height: 90px; background-color: green; position: absolute; left: -25px; z-index: 12;} 
    #backrightBox { width: 90px; height: 90px; background-color: blue; position: absolute; left: -15px; z-index: 11;} 
    </style> 

<div id="frontBox"> 

    <div id="backleftBox"></div> 
    <div id="backrightBox"></div> 

</div> 

Answer 1

"backleftBox"と "backrightBox"は "frontBox"の子です。 「frontBox」の外に移動すると、下に移動する必要があります。彼らはその中にいるとき

Answer 2

backrightBoxとbackleftBoxはfrontBox後ろにすることはできません。どのように見たいか分かりませんが、そのように入れ子にすることはできません。その場合、位置とマージン属性を変更して整列させる必要があります。あなたがそれを持っているかのようにz-indexはうまくいきます。