Stacking Context & Z-index — Learning Bundle
层叠上下文与 Z 轴顺序（教学组合）
这组教学连接两个 CSS 概念。Stacking Context 会单独管理自己的绘制顺序；z-index 则为该上下文中符合条件的盒子排序。这个组合本身不是单个标准 CSS 术语。
另一个例子
工具提示即使设置为 z-index 999，仍可能被相邻图层盖住，因为 transformed 父级建立了不同的 Stacking Context。
主要部分
- 01外部限制
- 02内容与间距模型
- 03计算尺寸或重排结果
什么时候用
调整 z-index 前，先找出真正影响它的 Stacking Context。
什么时候不要用
不要用超大的 z-index 掩盖不同上下文之间的真正边界。
代码里的名称
stacking context / z-index 上线前要检查
确认每个成员概念都有自己的名称与指南，并放在同一个场景中比较。用看得到的规则说明各成员何时适用、哪些组合合理。不可把整组说成单一正式模式，也不可说成能任意替换的做法。
预期结果：用 层叠上下文与 Z 轴顺序（教学组合） (Stacking Context & Z-index — Learning Bundle) 比较其中不同的概念。说明各自边界，再判断哪些成员适用、哪些可以一起使用。 用户场景：工具提示即使设置为 z-index 999，仍可能被相邻图层盖住，因为 transformed 父级建立了不同的 Stacking Context。 要拆解的教学组合：层叠上下文与 Z 轴顺序（教学组合） (Stacking Context & Z-index — Learning Bundle)。 正式成员指南：堆叠上下文 (Stacking Context)、CSS z-index (z-index) 这项比较的价值：调整 z-index 前，先找出真正影响它的 Stacking Context。 不可把整组当成单一模式的情况：不要用超大的 z-index 掩盖不同上下文之间的真正边界。 比较要求：分别列出每个成员概念，说明各自的工作与边界。把所有成员放进同一个真实场景。指出哪些看得到的信号会决定采用、组合或排除每个成员。 决策质量：说明平台与证据的限制。指出哪些概念可以共存，也要标出错误类比、不安全替代，以及应改用其他概念的情况。 验收标准：读者能用一句话解释每个成员，在示例中看出差异，说明采用某个成员或合理组合的理由，并打开每个成员的正式指南。 证据与限制（证据边界）：这不是正式规范标准。不同来源使用的名称、范围和预期做法可能不同。 待确认：目标平台、决策场景、限制，以及采用、组合或排除成员所需的证据。
检查这份需求
请 AI 编程助手检查当前如何使用 层叠上下文与 Z 轴顺序（教学组合） (Stacking Context & Z-index — Learning Bundle)。 定义：这组教学连接两个 CSS 概念。Stacking Context 会单独管理自己的绘制顺序；z-index 则为该上下文中符合条件的盒子排序。这个组合本身不是单个标准 CSS 术语。 生产环境检查：确认每个成员概念都有自己的名称与指南，并放在同一个场景中比较。用看得到的规则说明各成员何时适用、哪些组合合理。不可把整组说成单一正式模式，也不可说成能任意替换的做法。 修改程序前，先列出看到的证据、缺口、严重程度，以及最小且安全的修正。