层叠上下文，是一种特殊css环境。在这个环境下，有了Z轴的概念。跟文档流只有x，y轴所不同，层叠上下文主要是由Z轴这个概念。
创建层叠上下文的方法
- html元素
- position为absolute或者relative，但z-index不为auto（默认值）
- position为fixed或者sticky
- flex元素的子元素且z-index不为auto
- transform不为none的元素
层叠等级：z-index>0 > z-index:auto/z-index:0 > 浮动盒子 > block块级盒子 > (z-index < 0) > 当前元素所处的层叠上下文
当遇到元素层叠时，我们如何判断谁上谁下呢，这就相当于在比较层叠权重？
- 我们需要先判断两个元素是否处于同一个层叠上下文中，如果是，就判断谁的层叠等级更高点，谁就在上面
- 如果不是同一个层叠上下文。那么就比较它们所处的层叠上下文的层叠权重。如果层叠等级一样，后面的元素的层叠权重就要比前面的高。
