Use when reviewing rendered HTML, interactive components, or design-system patterns related to Link table cells to headers using IDs. Check native semantics fir
复制下面这句话,粘贴给 Claude Code、Codex、Cursor 等 AI 编程工具,它会读取安装说明并在你确认后完成安装。
请阅读 https://ai.atlankj.com/install/asset/gh-td-headers-attr-08d468a6a269 ,按照其中的说明把「td-headers-attr」安装到你(当前 AI 工具)中。执行前先告诉我将运行的命令和写入的位置,等我确认。
查看 AI 将读取的安装说明正在读取 GitHub 原文…
内容来自 GitHub 原始文件,由原作者维护。在 GitHub 查看
In complex tables with multi-level headers, explicit header-to-cell linking ensures screen readers accurately announce the relationship between data and its context.
headers attribute for complex tables where scope isn't enoughheaders attribute references valid id values of <th> elementsVerify that td headers attributes reference valid and existing th IDs.
Correct the headers attribute to reference the appropriate th IDs.
Explain when to use the headers attribute instead of scope for complex table structures.
Review the rendered markup and interactive states that affect Link table cells to headers using IDs. Flag exact elements, roles, labels, focus behavior, or keyboard interactions that violate the rule, and note how to verify the fix with browser accessibility tooling or assistive tech.
For full implementation details, code examples, and framework-specific guidance,
see references/rule.md.
Rule page: https://frontendchecklist.io/en/rules/accessibility/td-headers-attr