tabindex
tabindex 属性は要素がフォーカス可能かどうか、およびタブキーによるフォーカス順序を制御します。
概要
tabindex 属性は要素がフォーカス可能かどうか、およびタブキーによるフォーカス順序を制御します。
対応ブラウザ
デスクトップ
Chrome 1+
Edge 18+
Safari 3.1+
Firefox 1.5+
モバイル
Chrome Android 18+
Safari iOS 2+
Firefox Android 4+
基本構文
HTML
<!-- フォーカス可能にする（タブ順序に含まれる） -->
<div tabindex="0" role="button">カスタムボタン</div>
<!-- プログラムからのみフォーカス可能 -->
<div tabindex="-1" id="notification">通知エリア</div>
<!-- tabindex="0" 以上で順序指定（非推奨） -->
<input tabindex="1"> <input tabindex="2">実務での使いどころ
-
tabindex の活用
要素のタブ順序とフォーカス可能性を制御する属性。キーボードナビゲーションに重要。
注意点
- 古いブラウザでは対応していない場合がある。
アクセシビリティ
- スクリーンリーダーでの読み上げを確認すること。