元素的 transform 属性值不为 none
元素的 mix-blend-mode 属性值不为 normal
元素的 filter 属性值不为 normal
元素的 isolation 属性值为 isolate
position: fixed
will-change 中指定了上述任意属性，即便你没有直接定义这些属性
元素的 -webkit-overflow-scrolling 属性值为 touch
以上列表译自：
https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context，提醒广大读者，别看中文版，因为中文版并非实时跟进更新的，且翻译不太准确
2.2 提升层叠上下文中的层级
以上元素建立新层叠上下文的同时，也会提升元素自身所在层叠上下文中的层级。
我们以 opacity 为例。来看下 CSS3 规范中的话：
If an element with opacity less than 1 is not positioned, implementations must paint the layer it creates, within its parent stacking context, at the same stacking order that would be used if it were a positioned element with ‘z-index: 0’ and ‘opacity: 1’. If an element with opacity less than 1 is positioned, the ‘z-index’ property applies as described in [CSS21], except that ‘auto’ is treated as ‘0’ since a new stacking context is always created.
如果元素 opacity 小于 1 且未定位，则必须在其父层叠上下文中，按其在定位了的、z-index: 0 且 opacity: 1 的情况中的层叠顺序绘制。如果 opacity 小于 1 且已定位，z-index 属性按 CSS2.1 应用，但 auto 要视为 0，因为新的层叠上下文总是创建了的。
如下案例：
div { width: 100px; height: 100px;}#box1 { position: absolute; background: red; top: 40px; left: 40px;}#box2 { background: blue;}
查看更多关于CSS>CSS3中的层叠上下文初探_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did109610