tabindex
The tabindex global attribute controls whether and in what order an element is keyboard focusable.
Syntax
tabindex="0"Examples
<div tabindex="0" role="button">Custom button</div>
<div tabindex="-1" id="focus-target">Programmatic focus only</div>
Output
The first div joins the natural tab order; the second is focusable only via script (element.focus()).
Notes
Use tabindex="0" to make custom widgets focusable and tabindex="-1" for programmatic focus. Avoid positive values; they create confusing, hard-to-maintain tab orders.
Browser & runtime support
| Environment | Since version |
|---|---|
| chrome | 1.0 |
| firefox | 1.0 |
| safari | 1.0 |
| edge | 12 |