即在相同的层叠上下文的情况下,各个属性内容叠在上面的优先级,从下往上是:
- 背景和边框 (Background & Borders):最底层,地基。
- 负 z-index (-ve z-index):
z-index为负值的定位元素(Positioned)。 - 块级盒子 (Block):普通的
div等,用于布局。 - 浮动盒子 (float):
float元素。 - 行内盒子 (Inline):
span、文字内容。- 注意: 浏览器认为内容(文字)比布局(块/浮动)更重要,所以文字默认会浮在 div 上面。
- z-index: auto / 0:
z-index为 0 或 auto 的定位元素。 - 正 z-index (+ve z-index):
z-index> 0 的定位元素(数值越大越靠上)。