我的理解：更新于2024年12月12日（不考虑浮动元素，因为不常用）
-
默认情况下，只有根元素（就是 html 元素）一个层叠上下文。
-
各种元素在根层叠上下文上排放，如果发生重叠，就会按默认的一套规则来层叠元素，例如什么元素会在什么元素上面，涉及元素类型和元素在文档中出现的先后顺序等。
-
在这个基础之上，如果我们想改变默认的层叠效果，可以通过给其中的一些元素设置 z-index 值，值是整数，大的在上面。
- 但是不是所有的元素都适用于 z-index 属性，z-index 只在特定的元素下会生效。z-index 不生效的元素仍然按默认的规则层叠。
-
-
以上，就是在同一个层叠上下文里面元素如何叠加的全部知识了。
-
所有元素都使用同一个层叠上下文，管理起来容易混乱。这时可以新建层叠上下文。
-
一些情况下元素会创建新的层叠上下文，新的层叠下文元素和普通元素一样，只不过具有层叠上下文的元素里面的所有元素会成为一个整体参与层级排序。新的层叠上下文元素里面的元素的 z-index 值，不影响外面的 z-index 值。
-
具体细节：
- 默认的规则？
- 什么情况下会形成新的层叠上下文？
答案都在这个链接：developer.mozilla.org/zh-CN/docs/…
