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?

1                                          z-index
2 <div id=A>                                Auto 1
3     <div id=B>                            Auto 1.1
4        <div id=C style="z-index:1"></div>          Manual 1
5        <div id=D></div>                   Auto 1.1.2
6     </div>
7     <div id=E></div>                      Auto 1.2
8 </div>
9 <div id=F></div>                          Auto 2