Thuộc tính tabindex trong HTML

Thuộc tính tabindex trong HTML xác định thứ tự tab của một phần tử trong tài liệu HTML. Đây là một thuộc tính toàn cục (global attribute), có nghĩa là nó có thể được sử dụng trên bất kỳ phần tử HTML nào.

Cú pháp

Cú pháp như sau:

<tagname tabindex="number"></tagname>

Ví dụ

Dưới đây là ví dụ minh họa thuộc tính tabindex trong HTML:

<!DOCTYPE html>
<html>
<style>
  body {
    color: #000;
    height: 100vh;
    background-color: #8BC6EC;
    background-image: linear-gradient(135deg, #8BC6EC 0%, #9599E2 100%);
    text-align: center;
  }
  p {
    font-size: 1.2rem;
  }
</style>
<body>
<h1>Thuộc tính tabindex trong HTML</h1>
<p tabindex="5">Tôi là đoạn văn.</p>
<p tabindex="4">Tôi là đoạn văn.</p>
<p tabindex="3">Tôi là đoạn văn.</p>
<p tabindex="2">Tôi là đoạn văn.</p>
<p tabindex="1">Tôi là đoạn văn.</p>
<p>Bây giờ, hãy thử điều hướng qua các đoạn văn bằng phím Tab</p>
</body>
</html>

Kết quả

Bây giờ hãy thử điều hướng qua các đoạn văn bằng phím Tab.