优先使用原生语义
每个组件都以具备正确角色和键盘行为的平台控件为基础:<button>、<dialog>、<details>、复选框和单选框,以及Popover API。ARIA作为回退方案。
键盘导航
- 激活——Enter和Space激活按钮和切换按钮;Space切换复选框和开关。
- 复合控件——方向键在菜单、标签页、单选框组和工具栏内移动焦点;Home和End跳到第一项和最后一项。
- 浮层——Escape关闭对话框、弹出层和菜单,并将焦点返回触发器。
- Tab顺序——只有交互元素参与Tab导航;禁用的控件会被跳过。
每个组件页面都列出了对应的键盘交互。
焦点管理
模态对话框打开时将焦点限制在内部,关闭时恢复焦点。弹出层和菜单通过各项的游走式tabindex管理焦点。焦点可见样式由应用CSS提供,可使用data-state和:focus-visible。
如何验证
本页的每项承诺都有发布门禁保障:在Chromium、Firefox和WebKit中axe违规数为零,Tier 0组件还须完整通过禁用JavaScript的测试套件。查看验证依据