表格中scope="col"用于列标题单元格，标识其正下方整列数据；scope="row"用于行标题单元格，标识其右侧同行列数据；左上角空单元格不加scope，合并单元格须显式声明，复杂结构应改用headers+id。
scope="col" 用在顶部列标题行
当你把 <th> 放在 <code><thead> 里、作为表格第一行的单元格（比如“姓名”“年龄”“城市”），它描述的是**正下方一整列数据**，必须设 <code>scope="col"。不设的话，屏幕阅读器读到第二行第二个 <td> 时，可能只报“25”，而不是“年龄：25”。
<ul>
<li>常见位置：<pre class="brush:php;toolbar:false;"><thead><tr>
<th scope="col">产品</th>
<th scope="col">销量</th>
</tr></thead></pre>
</li>
<li>即使该列有 <code>rowspan="2"，也得显式写 <code>scope="col"，否则读屏软件会漏掉第二行对应列的数据
scope——<th> 的语义不靠样式生效
<h3>scope="row" 用在每行最左侧的行标题</h3>
<p>当 <code><th> 出现在 <code><tbody> 每行第一个位置（比如“张三”“李四”“Q1汇总”），它描述的是**同一行右侧所有 <code><td>**，应设 <code>scope="row"。
- 典型结构：
<tr> <th scope="row">张三</th> <td>85</td> <td>92</td> </tr> - 左上角那个空
<th>（<code><th></th>）别加scope，它既不属行也不属列，加了反而误导辅助技术 - 动态渲染时，别用
v-for或.map()只传 label 就完事——必须根据上下文判断是列循环还是行循环，分别注入scope="col"或scope="row" -
rowspan超过 1 的列标题 → 统一用scope="col" -
colspan覆盖多列的顶层标题（如“2024年”跨 Q1–Q4）→ 优先考虑scope="colgroup"+<colgroup span="4"></colgroup>，而不是硬塞scope="col" - 如果用了
scope="colgroup"却没配真实<colgroup></colgroup>结构，JAWS 和 NVDA 都会直接忽略该声明 - 正确做法：给合并表头加
id，比如<th id="q1-revenue">Q1营收</th> - 每个
<td> 显式绑定多个表头：<code><td headers="q1-revenue q1-cost"></td> -
headers优先级高于scope，且支持一对多、跳格、非线性关联
真正容易被忽略的不是“怎么写”，而是“什么时候不该写”：左上角空单元格不加
带 rowspan/colspan 的 th 必须手动声明 scope
浏览器对合并单元格的语义推断极不可靠。一个 rowspan="3" 的列标题，如果不写 scope="col"，屏幕阅读器很可能把第三行数据全归到第一行表头下，导致归属错乱。
复杂表格别硬套 scope，改用 headers + id
当出现跨多行+跨多列的 <th rowspan="2" colspan="3">，或者多层 <code><thead>、右对齐列标题等非标准布局时，<code>scope 已经超出设计能力。强行使用会导致读屏错报，且 WCAG 检测工具不会报错，但视障用户实际无法理解数据关系。
scope，<td> 上永远别用 <code>scope（HTML5 不支持），以及动态生成时 scope 类型必须随数据结构走，不能靠位置硬猜。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
