tabindex

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since ⁨julho de 2015⁩.

Oatributo globaltabindex indica se um elemento pode receber foco de entrada (se ele éfocável), se e em qual posição ele deve fazer parte da navegação sequencial do teclado (geralmente com a teclaTab, daí seu nome).

Experimente

<p>Click anywhere in this pane, then try tabbing through the elements.</p><label>First in tab order:<input type="text" /></label><div tabindex="0">Tabbable due to tabindex.</div><div>Not tabbable: no tabindex.</div><label>Third in tab order:<input type="text" /></label>

p {  font-style: italic;  font-weight: bold;}div,label {  display: block;  letter-spacing: 0.5px;  margin-bottom: 1rem;}div:focus {  font-weight: bold;}

Ele aceita valores inteiros, com diferentes resultados dependendo do valor desse inteiro:

umvalor negativo (geralmentetabindex="-1") significa que o elemento não deve ser localizado pela navegação sequencial do teclado, mas pode ser focável visualmente ou com JavaScript. Isso é mais útil para criar widgets accessíveis com JavaScript.
Nota:Um valor negativo é útil quando você tem conteúdo fora da tela que aparece com um evento específico. O usuário não poder focar em nenhum elemento com umtabindex negativo utilizando o teclado, porém um script pode o fazer utilizando ométodofocus().
tabindex="0" significa que o elemento deve ser focável e que pode ser localizado pela navegação sequencial do teclado, mas a sua posição será definida pela ordem no código-fonte do documento;
umvalor positivo significa que o elemento deve ser focável e que pode ser localizado pela navegação sequencial do teclado, e a sua posição definida pelo valor do número. Sendo assim,tabindex="4" seria focado antes detabindex="5", mas depois detabindex="3". Se vários elementos possuírem o mesmo valor positivo detabindex, a sua posição na ordenação será definida pela sua posição no código-fonte do documento. O valor máximo dotabindex é 32767. Se não especificado, assume o valor padrão 0.
Aviso:Evite usar valores dotabindex maiores que 0. Ao fazer isso dificulta para pessoas que dependem de tecnologias assistivas para navegar e operar o conteúdo da página. Ao invés disso, escreva o documento com os elementos em uma sequência lógica.

Se o atributotabindex for definido em um elemento div<div>, seu conteúdo filho (interno) não poderá ser rolado utilizando as teclas direcionais a menos que seja definidotabindex no conteúdo também.Veja este fiddle para entender melhor os efeitos de rolagem do tabindex.