HTML tabindex Attribute

Last Updated : 27 Jul, 2026

This attribute is used to specify the tab order of an element. It is used when the tab button is used for navigation.

Syntax

<element tabindex = "number">

Attribute Value: This attribute contains single value number which is used to specify the tabbing order of the element.

Difference between HTML 4.1 and HTML 5: In HTML5, this attribute can be used with any HTML element but in HTML 4.01, the tabindex attribute can be used with: <a>, <area>, <button>, <input>, <object>, <select>, and <textarea>.

Example: In this example we demonstrates the tabindex attribute, setting custom tab order for three links. It includes centered headings and styled content, with green color for the main heading.

HTML 
<!--Driver Code Starts-->
<!DOCTYPE html>
<html>
  
<head>
    <title>tabindex attribute</title>
    <style>
        body {
            text-align: center;
        }
        h1 {
            color: green;
        }
        a {
            text-decoration: none;
        }
    </style>
</head>
<body>
    <h1>GeeksforGeeks</h1>
<!--Driver Code Ends-->

    <h2>tabindex attribute</h2>
    <a href=
"https://www.geeksforgeeks.org/" 
        tabindex="2">Geeks HTML ide</a>
    <br>
    <a href=
"https://www.geeksforgeeks.org/" 
       tabindex="1">
        GeeksforGeeks
    </a>
    <br>
    <a href=
"https://www.geeksforgeeks.org/" 
       tabindex="3">
        Geeks ide
    </a>

<!--Driver Code Starts-->
</body>
  
</html>
<!--Driver Code Ends-->
Comment

Explore