scope 和 headers 是保障表格可访问性的关键防线，而非锦上添花；必须严格按位置设置 scope="col"/scope="row"，复杂结构需用 id+headers 显式绑定，caption 则是语义起点且不可省略。
scope 和 headers 不是“锦上添花”，而是让屏幕阅读器不把“85”读成“张三的第2列”这种错误的关键防线。
scope="col" 和 scope="row" 必须按位置硬写，不能靠猜测
浏览器和屏幕阅读器不分析视觉对齐或 CSS 位置，只认 scope 值和它在 DOM 中的实际位置：
-
<thead>里第一行的<th>—— 必须是scope="col"（比如<th scope="col">姓名</th>） -
<tbody>里每行第一个<th>—— 必须是scope="row"（比如<th scope="row">李四</th>） - 写反了（如把行标题写成
scope="col"），屏幕阅读器会把“李四”当成“第1列名”，后续读到“92”时就会说“李四：92”，而不是“英语：92” - 动态生成表格时，别用
i === 0统一加scope="row"——要区分是遍历行还是遍历列
headers 属性是 scope 失效时的唯一补救手段
当出现 rowspan、colspan、多层表头或表头不在标准行列位置时，scope 就完全不够用了。这时必须用 id + headers 显式绑定：
- 给每个相关
<th>加唯一id（如<th id="dept-header">部门</th>） - 在对应
<td>上写headers="dept-header salary-header"（注意：空格分隔，不是逗号） -
<td>上写scope是无效的，所有浏览器都会忽略，检测工具会直接报ARIA attribute is not allowed: scope - 不要指望视觉居中或缩进能“暗示”关系——屏幕阅读器只解析
headers值
caption 不是可选装饰，而是表格语义起点
<caption> 是屏幕阅读器进入表格时最先读出的内容，它决定了用户是否继续听下去：
立即学习“前端免费学习笔记（深入）”；
- 必须紧贴
<table>标签后，不能塞进<thead>或其他地方 - 内容要具体，比如
<caption>2026年Q1前端班学员考核成绩</caption>，而不是“数据汇总” - 禁用已废弃的
summary属性，HTML5 不再支持 - 没有
<caption>，辅助技术可能跳过整个表格上下文，尤其当页面有多个表格时
真正难的不是查文档写对 scope，而是在每次写 <th> 时下意识问一句：“它管的是上面一列，还是左边一行？”——这个条件反射比任何自动检测工具都管用。
