css 中的 stacking context 和 z-inde

spec

• propdef-z-index
• zindex

articles

• what-no-one-told-you-about-z-index
• understand-css-stacking-context-order-z-index

总结：

Within each stacking context, the following layers are painted in back-to-front order:

• the background(background color 、background image) and borders of the element forming the stacking context.
• the child stacking contexts with negative stack levels (most negative first).
• the in-flow, non-inline-level, non-positioned descendants.
• the non-positioned floats.
• the in-flow, inline-level, non-positioned descendants, including inline tables and inline blocks.
• the child stacking contexts with stack level 0 and the positioned descendants with stack level 0.
• the child stacking contexts with positive stack levels (least positive first).