z-index 层叠上下文


取值范围:有符号 2**32,最大值 2147483647

并不是用于渲染的合成层(Chrome Devtools Layers Panel 可以查看合成层

同一层中,分为背景类和内容类,背景显示在后面,内容(文字,img)显示在上面,在同一层同一类中才有后绘制的显示在上面的规则
For a positioned box (that is, one with any position other than static), the z-index property specifies:
  1. The stack level of the box in the current stacking context.
  2. Whether the box establishes a local stacking context.
A stacking context(SC) is formed, anywhere in the document, by any element in the following scenarios:

在层叠上下文中,其子元素的堆叠顺序跟上面解释的规则相同。 特别值得一提的是,其子元素的 z-index 值只在父级层叠上下文中(理解为层)有意义。子级层叠上下文被自动视为父级层叠上下文的一个独立单元。