fixed定位失效是因父容器设置transform/perspective/filter创建新包含块，使fixed元素相对其定位而非视口；被遮挡是因z-index跨层叠上下文无效；移动端问题源于iOS Safari渲染缺陷及viewport配置不当。
fixed定位元素为什么一滚动就消失？
因为父容器设置了transform、perspective或filter，浏览器会创建新的层叠上下文和包含块，position: fixed就失效了——它不再相对于视口定位，而是相对于这个新包含块。
- 常见场景：用
transform: translateZ(0)强行开启硬件加速的滚动容器、Modal弹窗里套了带filter: blur(1px)的遮罩层 - 检查方法：在开发者工具里选中消失的元素，看Computed面板中
position下面的Containing block是否指向某个父级（而不是Viewport） - 临时绕过：给父级加
transform: none !important或删掉filter，但可能影响动效，得权衡
fixed元素被遮挡在其他内容下面怎么办？
z-index只在同一个层叠上下文中生效；如果fixed元素和遮挡它的元素分属不同层叠上下文，调高z-index没用。
- 典型诱因：遮挡元素的某个祖先有
position: relative且z-index设为正数（哪怕只是1），就会创建新层叠上下文 - 验证方式：在Elements面板里逐级查看遮挡元素及其祖先的Computed
z-index和contain值，留意stacking context标记 - 解法不是盲目加
z-index: 9999，而是找到那个“意外创建层叠上下文”的祖先，把它z-index设为auto，或干脆去掉position
移动端fixed定位抖动/错位/失效
iOS Safari和部分安卓WebView对position: fixed支持不稳，尤其在键盘弹出、页面缩放或viewport设置不当的时候。
- 必查项：
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">里不能漏掉maximum-scale=1.0，否则键盘收起后视口缩放状态残留，fixed元素位置就偏了 - 键盘问题：iOS下输入框获得焦点时，fixed元素可能被顶起或卡住，可用
resize事件监听window.innerHeight变化，临时切为position: absolute - 替代思路：不用
fixed，改用position: sticky配合top: 0（兼容性够用的话），它在滚动中更稳定
position: fixed，越容易掉进这些隐性约束的坑。 
