顺序规则
如果不设置节点的 position 属性，位于文档流后面的节点会遮盖前面的节点。
定位规则
- 设置节点的 position: static; 位于文档流后面的节点会遮盖前面的节点。
- 设置节点为非 static，则该节点会覆盖没有设置 position 或 position: static; 的节点。
参与规则
z-index 仅在节点的 position: relative/absolute/fixed; 时有效。
默认值规则
若所有的节点都定义了 position: relative;
- z-index: 0; 的节点与没有设置 z-index 的节点在同一层级内没有高低之分。
- z-index >= 1 的节点会遮盖没有设置 z-index 的节点。
- z-index < 0 的节点会被没有定义 z-index 的节点覆盖。
从父规则
如果都设置了 position: relative;
- 同级元素元素 A 的 z-index 大于 元素 B 的 z-index，那么 A 的子元素必定覆盖在 B 的子元素上。
- 同级元素元素 A 的 z-index 等于 元素 B 的 z-index，则根据顺序规则，B 覆盖在 A 上，则 A 的子元素设置的再大，也不可能覆盖过 B 的子元素。
网友评论