scope属性必须按实际管辖范围正确设置：管列用scope="col"（位于thead的th），管行用scope="row"（位于tbody首th）；合并单元格需显式声明；复杂表格须改用headers+id绑定。
scope 属性写错位置或值，屏幕阅读器就会把“张三”和“销售额”配错——它不报错，但用户听到的是错的。
scope="col" 和 scope="row" 到底该写在哪儿
不是看文字内容，而是看这个 <th> 实际“管”谁：管下方一整列数据，就用 <code>scope="col"；管右侧一整行数据，就用 scope="row"。
-
scope="col"必须出现在<thead> 里的 <code><th>，且该单元格正下方是同一列的 <code><td>（比如“姓名”“部门”“Q1销售额”） <li> <code>scope="row"必须出现在<tbody> 每行第一个 <code><th>，且该单元格右侧是本行所有 <code><td>（比如“华东”“华北”“iPhone”） <li>左上角那个 <code><th>（第1行第1列）不是空白占位符，它是第一个列标题，应设为 <code>scope="col"，不是留空、不是<td>、更不能硬塞 <code>scope="row" <td> 上写 <code>scope是无效的，HTML5 明确禁止，浏览器会忽略带 rowspan/colspan 的表头必须显式加 scope
仅靠
rowspan="2"或colspan="3"，屏幕阅读器无法推断语义。它不会自动认为“这个合并的<th> 管下面两行”，必须人工声明。 <ul><li>一个 <code><th rowspan="2">销售额</th>在<thead> 里，仍要加 <code>scope="col"- 一个
<th colspan="4">2024年</th>如果统领四季度列，优先考虑scope="colgroup"+<colgroup span="4"></colgroup>结构，而不是强行用scope="col" - 动态生成时，别用
if (i === 0) scope="row"统一批量加——要判断当前循环的是行索引还是列索引，否则首行所有<th> 都被误标为行标题 <h3>什么时候必须放弃 scope，改用 headers + id</h3> <p>scope 是快捷方式，不是万能钥匙。一旦表格出现以下任一情况，它就不可靠：</p><div class="aritcle_card flexRow artxards"> <div class="artcardd flexRow"> <a class="aritcle_card_img" rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher"><img src="https://img.php.cn/upload/skill/000/000/081/179109368394970.jpg" alt="Wechat HTML Publisher" onerror="this.onerror='';this.src='/static/lhimages/moren/morentu.png'" ></a> <div class="aritcle_card_info flexColumn"> <a rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher" class="overflowclass">Wechat HTML Publisher</a> <p class="overflowclass">直接上传HTML富文本到微信公众号草稿箱。支持完整的HTML格式,无需Markdown转换。</p> </div> <a rel="nofollow" href="/xiazai/skill6712" title="Wechat HTML Publisher" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a> </div> </div> <ul> <li> <code>rowspan或colspan跨多行/多列（如一个<th rowspan="3">销售区域</th>管三行） - 多层
<thead> 嵌套（如“年份 → 季度 → 月份”） <li>某个 <code><th> 同时是行头和列头（如第一行第一列既要管列又要管行） <li><code><th> 不在标准行列位置（例如右对齐的列标题、斜向表头） <p>这时必须切换到显式绑定：<code><th id="sales">销售额</th>+<td headers="sales dept q1-2024">1200</td>。注意：headers优先级永远高于scope，且所有id必须唯一、存在，否则整个绑定失效。真正难的不是记住规则，而是在每个
<th> 出现时都下意识问一句：“它管的是哪几行？哪几列？”——这个习惯比任何调试工具都管用。</th>
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
