tab
Widget roleA control within a tablist that displays its associated tabpanel when activated. It uses aria-selected to show which tab is active and aria-controls to point at its panel. Only the selected tab is in the tab order; arrow keys move between tabs per the APG pattern.
Used on
A label element inside a tablist.
Required properties
aria-selectedaria-controls— points to the tabpanel
Accessible name
From the tab's child text content.
Used by components
Example
role="tab"
<div role="tab" aria-selected="true"
aria-controls="p1" id="t1">Profile</div>References