overflow-anchor 在 元素上完全不生效；必须作用于包裹表格的、具备 overflow-y: auto 和固定高度的父级 容器，且 safari 完全不支持该属性。
overflow-anchor 对表格无效，别往 <table> 上加
<p>直接说结论：<code>overflow-anchor 在 <table> 元素上完全不生效。表格本身不是滚动容器，也不参与滚动锚定上下文——哪怕你给它加 <code>overflow-y: auto，浏览器也会忽略（因为 <table> 的盒模型不允许直接溢出裁剪）。常见错误是写成：
@@######@@
<p>这行不通。真正起作用的必须是包裹表格的、具备明确滚动能力的父容器。</p>
<h3>正确做法：把表格放进带 <code>overflow-y: auto 的 <div> 容器
<p>只有设置了 <code>overflow-y: auto 且有固定高度/最大高度的块级容器，才能成为滚动锚定的作用目标。表格跳动问题，本质是表格所在容器在动态插入行时发生了高度突变，触发了浏览器默认的锚定补偿。
- ✅ 正确结构：
<div class="table-wrapper"><table>...</table></div>
- ✅ 正确样式：
.table-wrapper { overflow-y: auto; max-height: 400px; overflow-anchor: none; }
- ❌ 错误写法：
table { overflow-anchor: none; }（被忽略）
- ❌ 错误写法：
.table-wrapper { overflow-anchor: none; } 但没设 overflow-y 或高度（属性无触发条件）
表格动态加载时仍跳动？检查这三件事
<div class="table-wrapper"><table>...</table></div>
.table-wrapper { overflow-y: auto; max-height: 400px; overflow-anchor: none; }
table { overflow-anchor: none; }（被忽略）.table-wrapper { overflow-anchor: none; } 但没设 overflow-y 或高度（属性无触发条件）加了 overflow-anchor: none 还跳，大概率不是 CSS 写错，而是底层布局不稳定：
- 表格行高未固定：
tr或td内含图片、异步文本、未设line-height，导致插入后重排 → 给td加vertical-align: top和line-height: 1.5 - 列宽未锁定：
table-layout: fixed没开，浏览器要重新计算每列宽度 → 必须加table { table-layout: fixed; width: 100%; } - 首行表头未占位：
<thead> 高度随内容浮动 → 给 <code>thead th设固定height或用min-height这些比
overflow-anchor更关键。没有它们，就算关了锚定，视觉抖动照旧。Safari 用户看不到效果？这不是 bug，是现实
overflow-anchor在 Safari 中**完全不支持**（截至 2026 年 7 月），无论你怎么写，它都当没看见。Chrome/Edge 里关闭锚定后滚动位置“不动”，Safari 里依然会微调——这不是你漏写了什么，是平台能力缺失。真实项目中必须降级：
- 对 Safari UA，提前给表格行预留高度：
tr::before { content: ""; display: block; height: 36px; }（配合visibility: hidden控制） - 用
white-space: nowrap+text-overflow: ellipsis防止单元格内文本换行引发高度突变 - 避免在表格内嵌
<img>或<iframe></iframe>，改用占位图 +aspect-ratio
记住：
overflow-anchor: none是 Chrome/Edge 的“快捷开关”，不是跨浏览器通用解法。表格场景下，控制盒模型稳定性永远比依赖这个属性更可靠。.my-table { overflow-anchor: none; overflow-y: auto; } - 对 Safari UA，提前给表格行预留高度：
