summary属性在HTML5中已被废弃，浏览器不解析、屏幕阅读器不再支持，应改用<caption>配合aria-describedby实现表格摘要功能。
summary 属性在现代 HTML 中已废弃，不能用——它在 HTML5 标准里被移除了，浏览器不验证、不渲染、屏幕阅读器支持也日益不可靠。
别再往 <table> 标签里写 summary="..."，那只是历史残留写法，现在起效极差，还可能干扰无障碍测试工具的判断。
summary 属性为什么失效了
- HTML5 规范（自 2014 年起）明确废弃了
summary属性 - Chrome、Firefox、Safari 均不解析该属性，DOM 中查不到，开发者工具里也看不到对应信息
- 主流屏幕阅读器（如 NVDA、VoiceOver）已转向依赖
<caption>和 ARIA 属性（如aria-describedby）获取表格语义 - W3C 推荐用更可靠、可验证的方式替代
替代方案：用 <caption> + aria-describedby
<caption> 是唯一被所有浏览器和读屏软件一致支持的表格标题机制，必须作为 <table> 的第一个子元素。
摘要类补充说明（比如“本表含2012–2013年U盘与耳机库存变动，不含退货数据”）应放在页面其他位置，再通过 ID 关联：
立即学习“前端免费学习笔记（深入）”；
- 把摘要文字写成一个带
id的<p>或<div> - 在
<table>上加aria-describedby="your-id"
<p id="inventory-summary">本表格记录2012年到2013年库存记录，包含U盘和耳机库存量，不含退货与调拨数据。</p> <p><table aria-describedby="inventory-summary"> <caption>2012年到2013年库存记录</caption> <thead><tr><th>商品名称</th><th>品牌</th><th>数量（件）</th></tr></thead> <tbody><tr><td>U盘</td><td>金士顿</td><td>120</td></tr></tbody> </table></p>
-
<caption>显示在表格上方，用户可见，且被读屏软件默认朗读 -
aria-describedby会让读屏软件把摘要内容接在 caption 后面一起读出，逻辑连贯 - 这种写法通过 axe、WAVE 等无障碍检测工具验证，无警告
容易踩的坑
- 把
<summary>标签直接写在表格外面当摘要用：这是错的。<summary>只能是<details>的子元素，独立使用无效，也不会被识别为表格摘要 - 用
<div>包住摘要但没加id或没关联aria-describedby：读屏软件完全感知不到 - 把长段摘要塞进
<caption>：caption 应简明（建议 ≤ 120 字），过长会破坏布局，也违背语义设计初衷 - 忘记给摘要文字加语言属性（如
lang="zh-CN"）：多语言页面中会导致读音错误或跳过
真正起作用的不是“写了什么标签”，而是“辅助技术能否稳定取到那段文字”。优先走标准路径，别抄近道。
