computed position变为static，是因为sticky被静默禁用：父容器overflow:hidden/auto/scroll、祖先transform/filter/will-change、flex/grid容器或自定义滚动容器截断了粘性上下文。
直接加 sticky-top 类却没吸顶，大概率不是类没加载，而是 sticky 定位被 DOM 结构或 CSS 环境“静默禁用”了——它不报错，只不生效。
为什么 computed position 变成了 static？
浏览器会直接忽略 position: sticky，只要它检测到以下任一条件：
- 元素的**直接父容器**设置了
overflow: hidden、overflow: auto或overflow: scroll - 任意祖先元素用了
transform（哪怕只是transform: translateZ(0)）、filter或will-change - 元素被包在
display: flex或display: grid的容器里（旧版 Safari 尤其敏感） - 页面最外层有自定义滚动容器（比如某些后台框架的
<div class="layout-scroll">），导致粘性作用域被限制在该容器内，而非视口
用 DevTools 选中目标元素，看 **Computed → position** 是否还是 sticky；如果不是，就从父节点开始逐级检查上述属性。
表格表头（<thead>）加 sticky-top 为啥完全不动？
因为 <thead> 是 display: table-header-group，浏览器明确不支持对其应用 sticky。你加了类，样式面板里能看到，但渲染时会被强制重置为 static。
立即学习“前端免费学习笔记（深入）”；
真正能生效的只有：
- 给每个
<th>单独写position: sticky; top: 0;，且必须配z-index: 1070和background-color: #fff - 外层容器（如
<div>）要设max-height: 400px+overflow-y: auto，仅靠table-responsive不够（它只处理横向滚动） - 避免
<th>的任何祖先有transform或overflow: hidden，否则 sticky 渲染区域会被裁剪
移动端（尤其 iOS Safari）吸顶卡顿或失效怎么办？
iOS Safari 对 sticky 的实现很脆弱，键盘弹出、页面返回、甚至快速滚动都可能让它掉帧或重置 top 值。
- 显式加
z-index: 1020（Bootstrap 默认值），防止被dropdown-menu或modal遮盖 - 禁用所有
transform相关样式——包括父容器的scale(1)、translateZ(0)，它们会创建新层叠上下文 - 别把 sticky 元素放在
height: 100vh容器里；iOS 上 min-height 计算异常会导致吸附失败，可改用min-height: -webkit-fill-available - 若必须兼容旧环境，别硬套 sticky：用
position: fixed+ 手动占位（如在下方加<div style="height: 60px"></div>）更可控
fixed-top 和 sticky-top 到底该选哪个？
别把它当成“轻量版 fixed”。sticky-top 是条件定位：只在滚动到临界点时吸附，离开就回归文档流；fixed-top 始终脱离文档流，不占原始位置。
关键差异在于占位逻辑：
-
sticky-top保留原有文档流高度，下方内容不会上移——适合布局敏感场景 -
fixed-top要求你手动确保首屏内容不被遮盖，比如给<body>加padding-top，或在首个内容容器上用pt-7类（对应 56px） - 如果 navbar 高度是响应式的（比如小屏下折叠后变矮），
sticky-top会自动适应，而fixed-top的 padding 得靠媒体查询或 JS 重算
最容易被忽略的是：sticky 的失效往往发生在多层嵌套和响应式断点切换之后，而不是初始加载时——得在真机上滚动、缩放、唤出键盘再测一遍。
