CSS position 值有哪些？

relative + absolute：关键配对

absolute 相对于其最近的已定位祖先元素（除 static 外的任何值）定位元素。因此，您在父元素上设置 position: relative 以使其成为参考点：

这种 relative-parent / absolute-child 模式随处可见：徽章、下拉菜单、工具提示、关闭按钮。

fixed 与 sticky

• fixed — 固定到视口（始终可见），例如持久导航栏。
• sticky — 表现为相对定位，直到达到阈值 (top: 0)，然后在其容器在视图中时保持在该位置 — 非常适合区域标题。

一个常见的陷阱

absolute/fixed 元素被移出常规流，因此不占用空间 — 兄弟元素表现得好像它们不存在，这可能导致重叠。需要做好规划（例如添加 padding 来补偿固定导航栏）。

为什么这很重要

position 对于覆盖层、粘性标题、模态框、下拉菜单和徽章至关重要。

relative-parent/absolute-child 关系和 fixed-vs-sticky 区分是你经常使用的实际核心。