z-index 详解

Definition and Usage

The z-index property specifies the stack order of an element.

An element with greater stack order is always in front of an element with a lower stack order.

Note: z-index only works on positioned elements (position:absolute, position:relative, or position:fixed).

Model: How is the z-index determined?

                                         z-index
<div id=A>                                Auto 1
    <div id=B>                            Auto 1.1
       <div id=C style="z-index:1"></div>          Manual 1
       <div id=D></div>                   Auto 1.1.2
    </div>                                
    <div id=E></div>                      Auto 1.2
</div>
<div id=F></div>                          Auto 2