绝对定位元素的 top/left 相对于最近的已定位祖先元素（position 为 relative、absolute、fixed 或 sticky），无则相对于初始包含块（视口）；box-sizing 和 margin 不影响其定位基准，常见问题多因父级未设定位或溢出裁剪导致。
绝对定位元素的 top/left 是相对于谁计算的
它不是相对于父容器的 padding 边缘，也不是浏览器窗口，而是相对于「最近的已定位祖先元素」（即 position 为 relative、absolute、fixed 或 sticky 的祖先）。如果没有这样的祖先，就相对于初始包含块（通常是视口）。
常见错误现象：top: 20px 在父 div 里没效果，或者“飘”到页面左上角外——大概率是父级没设 position: relative，导致脱钩到 body 或视口。
- 只要父级没设定位属性，
top/left就不会以它为参考系 -
position: static（默认值）不算“已定位”，不能当参考 - 如果中间某层是
fixed，那它就是参考，即使它在 DOM 上离得远
box-sizing 会影响 top/left 的最终位置吗
不影响。绝对定位的偏移量只决定元素边框盒（border box）的左上角坐标，跟盒模型内部怎么算宽高无关。
但容易混淆的点在于：你调了 top: 10px，结果内容看起来“没动够”，其实是元素自身尺寸变了（比如加了 padding 或 border），而你误以为偏移量被吃掉了。
立即学习“前端免费学习笔记（深入）”；
-
box-sizing: border-box改变的是width/height的含义，不改变top/left的作用对象 - 如果你用
left: 0+right: 0拉满宽度，box-sizing会影响实际渲染宽度，但起始点仍是 border box 左边缘 - 调试时建议临时加
outline: 1px solid red看 border box 实际位置
绝对定位后 margin 还起作用吗
起作用，但只影响元素自身的布局空间，不影响 top/left 基准点。
也就是说：top 定位的是 border box 顶边，之后再按正常流规则应用 margin——但因为它是脱离文档流的，这个 margin 不会推其他元素，只会让自己的内容区（content box）相对 border box 往内缩。
-
margin-top: 20px会让 content box 下移 20px，但 border box 顶边仍在top指定的位置 - 想整体下移，应该改
top，而不是加margin - 负 margin 可以让 content box 超出 border box，但不会改变定位基准
为什么设置了 top 却看不到元素
最常见原因是元素被遮挡或溢出裁剪了，而不是定位失效。
典型场景：父容器有 overflow: hidden，而子元素绝对定位后超出父边界；或者 z-index 层级太低，被盖住了；又或者元素本身 width/height 为 0（比如只有文字但没设 display: inline 以外的值，且没内容撑开）。
- 先检查 computed styles 中
top/left是否如预期生效（DevTools 里看“Layout”面板） - 再看父级是否有
overflow: hidden或clip-path - 确认
z-index有值且大于遮挡它的兄弟元素（注意 stacking context 影响） - 空元素记得设
width/height或至少min-height，否则可能“存在但不可见”
