position: sticky 不能直接固定 ，因其 display 为 table-header-group，不被 CSS 规范支持；必须作用于 或 ，并配合 table-layout: fixed、显式列宽、bg-white 和 z-50 才能正确生效。
position: sticky 能直接固定表头，但对 <textarea></textarea> 或纯文本区域无效——它只作用于表格单元格（<th>/<code><td>），不是通用滚动容器方案。
<h3>为什么 <code><thead> 加 <code>position: sticky 没反应
根本不是浏览器不支持，而是 <thead> 的 <code>display 是 table-header-group，CSS 规范明确不支持 sticky 定位。生效对象必须是 <th> 或 <code><td> 这类“可定位单元格”。
<ul><li>错误写法：<code><thead style="position: sticky; top: 0"> —— 完全无效
<li>正确写法：把 <code>position: sticky; top: 0 加到每个 <th> 上
<li>Firefox v90 及更早版本对 <code><th> 上的 <code>sticky 支持不稳定，v91+ 才推荐直接用
width（如 width: 20%）或 transform: translateZ(0)，否则列宽计算错位<th> 加了 <code>sticky 却被遮住或透底
只写 position: sticky; top: 0 远远不够。缺一不可的三项是：background-color、z-index、滚动容器配置。
-
background-color必须显式设置（如#fff），不能是transparent或未声明，否则滚动时文字被下方<td> 内容透出 <li> <code>z-index至少为10（推荐10起步），尤其当表格在Modal、Tooltip等层叠环境中时必须显式设值 - 建议加
border-bottom: 1px solid #ddd，否则表头和第一行数据之间容易视觉断裂 - 若用了
border-collapse: collapse，<th> 需额外加 <code>background-clip: padding-box防止边框裁剪异常表格列宽错位、
<th> 和 <code><td> 对不齐 <p>这不是 bug，是表格默认按内容自适应宽度导致的渲染不同步。<code>sticky的<th> 和滚动中的 <code><td> 分属不同渲染阶段，宽度没绑定。<p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p> <ul><li>给 <code><table> 加 <code>table-layout: fixed，强制按第一行（即<thead>）定义列宽 <li>所有 <code><th> 和对应 <code><td> 必须显式设 <code>width或min-width（如width: 120px或width: 20%） - 不要依赖内容撑开宽度——
table-layout: auto下sticky定位基准会漂移 - 列数多且需响应式时，用
<col>标签统一声明宽度比重复写width更稳定 - 不能对
<textarea></textarea>直接套position: sticky—— 它不是表格结构，也不生成<th> <li>常见做法：用 <code><div class="header">字段名</div>+<textarea></textarea>，外层包裹<div style="max-height: 300px; overflow-y: auto">，仅让 <code><textarea></textarea>滚动 - 若需多行标题（如带筛选栏），必须手动同步列宽：用
table-layout: fixed+<col>或 JS 读取首行字符宽度做等比缩放 - 真正麻烦的不是粘性定位本身，而是列宽对齐、滚动容器高度、
z-index层级、背景色这四点——漏掉任意一，用户一眼就能察觉“漂移”或“透底”
<textarea></textarea> 或文本区域怎么“固定表头”
文本域本身不支持表头概念，所谓“固定表头”实际是模拟：把标题行抽离成独立 DOM，与 <textarea></textarea> 同级并列，再靠 CSS 控制滚动关系。
