relative不脱离文档流但保留占位，absolute脱离文档流且依赖最近定位祖先；transform: translate()不影响布局流、不触发重排，是视觉偏移首选方案。
区别不在“相对”还是“绝对”这个词面上，而在文档流是否被破坏、定位参照物是谁、以及会不会意外影响其他元素布局——这三个点没理清，position 就容易用错。
relative 不脱离文档流，但“原地留坑”
设了 position: relative 的元素，视觉上能用 top/left 偏移，但它在文档流里原来占的位置一动不动。就像人站起来走了，椅子还留在原地。其他元素照常排布，完全感知不到它动过。
- 适合微调：按钮图标右移
2px、下划线往下压1px、tooltip 紧贴文字底部不撑高父容器 - 哪怕你
top: 100px，父div高度还是按它“没动时”的位置算 - 没写
top/left却设了relative，纯属冗余，还可能意外成为子absolute的锚点
absolute 必须有“爹”，否则就认 body
position: absolute 一上身，元素立刻从文档流消失，不占空间、不影响别人布局。但它定位的起点不是自己，而是往上找第一个 position 不是 static 的祖先——找不到？那就直接相对于视口（body）左上角定位。
使用HTML,CSS,JavaScript开发Android应用程序 英文文字pdf版附源文件
下载
如果你了解HTML，CSS和JavaScript，您已经拥有所需的工具开发Android应用程序。本动手本书展示了如何使用这些开源web标准设计和建造，可适应任何Android设备的应用程序 - 无需使用Java。您将学习如何创建一个在您选择的平台的Android友好的网络应用程序，然后转换与自由PhoneGap框架到一个原生的Android应用程序。了解为什么设备无关的移动应用是未来的潮流，并开始构建应用程序，提供更
- 必须配对使用：父容器加
position: relative（最轻量安全），子才肯乖乖相对它定位 - 常见翻车现场：
.popup { position: absolute; top: 0; right: 0; }，但父级没设定位 → 弹窗贴着浏览器右上角，而不是按钮旁边 - 注意隐式锚点：父级若用了
transform或filter，哪怕它是static，也可能悄悄创建新的 containing block，让子absolute参照错了对象
想偏移又不想搞乱布局？优先用 transform: translate()
如果目标只是小范围挪动、居中、悬停上浮，transform: translate() 比 relative + top/left 更干净，也比 absolute 更省心——它不改变文档流，不触发重排，还能丝滑过渡动画。
-
transform不影响其他元素布局，也不影响父容器高度计算 - 和
relative不同，它不会让元素变成子absolute的定位上下文 - 和
absolute不同，它不需要找“爹”，也不怕父级overflow: hidden截断
真正难的不是记住定义，而是判断：这个偏移要不要保留原始占位？这个弹层该挂在哪一级父容器上？有没有更轻量的替代方案？这些才是实际写 CSS 时卡住的地方。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
