渲染层、堆叠次序与z-index
2017-07-28 本文已影响18人
Ager张卫刚
渲染层
渲染层创建条件
- 页面的根元素
<html>创建了默认的堆叠上下文 - 成为定位元素且具有非
auto的z-index属性值 - 元素具有小于 1 的
opacity属性 - 在 Webkit 和 Chrome 22+ 中，固定定位的元素，即使
z-index为 auto，也会创建 -
transform属性不为none
堆叠次序
默认堆叠次序
没有z-index属性的元素，按照一下顺序从底到顶依次排列
- 根节点的背景和边框
- 文档流中的后代元素，按照在
HTML中出现的顺序 - 浮动元素
- 脱离文档流的定位后代元素，按照在
HTML中出现的顺序
