CSS中position的四个常用值是static、relative、absolute和fixed：static为默认，不脱离文档流且偏移属性无效；relative相对原位偏移但仍占空间；absolute脱离文档流，相对于最近已定位祖先定位；fixed脱离文档流且始终相对视口固定。
在 CSS 中，position 属性用于控制元素的定位方式，最常见的四个取值是：static、relative、absolute 和 fixed。它们决定了元素如何在文档流中放置以及是否脱离正常布局。
static：默认定位，不脱离文档流
这是所有元素的默认值，元素按正常文档流排列，top、right、bottom、left 和 z-index 属性对其无效。
- 无需显式声明，浏览器自动应用
- 适合不需要特殊定位的普通内容块
relative：相对自身原位置偏移
元素仍保留在文档流中（占据原来空间），但可通过 top、right 等属性相对于它原本的位置做偏移。
- 常用于微调元素位置，或作为 absolute 子元素的定位上下文
- 设置 relative 后，z-index 生效，可用于层叠控制
absolute：绝对定位，脱离文档流
元素完全脱离文档流，不再占据空间，定位参考点是最近的已定位祖先元素（即 position 值为 relative/absolute/fixed/sticky 的祖先）；若无，则相对于初始包含块（通常是视口）。
立即学习“前端免费学习笔记（深入）”；
- 必须配合 top、right、bottom、left 使用才有意义
- 常见于弹窗、下拉菜单、图标标注等需要精确控制位置的场景
fixed：固定定位，相对于视口定位
元素脱离文档流，且定位参考始终是浏览器视口（viewport），即使页面滚动，它也保持在屏幕同一位置。
- 适合实现返回顶部按钮、悬浮客服、导航栏吸顶等效果
- 注意：在 iOS Safari 中某些情况下可能表现异常，需配合 transform: translateZ(0) 或 will-change: transform 修复
基本上就这些。掌握这四个值的关键，在于理解“是否脱离文档流”和“定位参考是谁”。用对了，布局会更可控；用错了，容易出现重叠、错位或滚动异常。
