CSS 属性 z-index

Docs

• 定位 - 学习 Web 开发 | MDN (mozilla.org)
• z-index - CSS：层叠样式表 | MDN (mozilla.org)
• position - CSS：层叠样式表 | MDN (mozilla.org)

CSS 属性 z-index

• z-index 属性用来设置定位元素的层叠顺序（仅对定位元素有效）
  • 取值可以是正整数、负整数、0
• 比较原则
  • 如果是兄弟关系
    • z-index 越大，层叠在越上面
    • z-index 相等，写在后面的那个元素层叠在上面
  • 如果不是兄弟关系
    • 各自从元素自己以及祖先元素中，找出最邻近的 2 个定位元素进行比较
    • 而且这 2 个定位元素必须有设置 z-index 的具体数值

---

Loading Github Gist ...

Details

See the Pen by jaimezeng (@jaimezeng) on CodePen.