渲染层、堆叠次序与z-index

渲染层

渲染层创建条件

  • 页面的根元素创建了默认的堆叠上下文
  • 成为定位元素且具有非autoz-index属性值
  • 元素具有小于 1 的 opacity 属性
  • 在 Webkit 和 Chrome 22+ 中,固定定位的元素,即使 z-index 为 auto,也会创建
  • transform 属性不为 none

堆叠次序

默认堆叠次序

没有z-index属性的元素,按照一下顺序从底到顶依次排列

  1. 根节点的背景和边框
  2. 文档流中的后代元素,按照在HTML中出现的顺序
  3. 浮动元素
  4. 脱离文档流的定位后代元素,按照在HTML中出现的顺序

你可能感兴趣的:(渲染层、堆叠次序与z-index)