絶対的に下部に配置された div が上部の div をブロックするのはなぜですか? _html/css_WEB-ITnose

<div align="center" style="width:100%;position:absolute;background-color:#660;z-index:1;"><br /><br />z-index:1</div><div align="center" style="background-color:#066;z-index:2;">z-index:2</div><div align="center" style="background-color:#606;z-index:0;">z-index:0</div>

上記のコードで、z-index:1 が z-index:2 もカバーするのはなぜですか?
互いの順序を変更せずに、z-index:1とposition:absoluteでこのdivを作成する方法は、z-index:0のみをブロックし、z-index:2はブロックしません

ディスカッションへの返信（解決策）

z-index:1

z-index: 2

z-index:0

< ;div align="center" style="width:100%;position:absolute;background-color:#660;
z-index:1;">

z - インデックス:1

z-index:2

z-index:0