HTML tabindex Attribute

 

Definition and Usage

The tabindex attribute is a global attribute. It specifies the tab order for an element.

Value :

Only integer can be set as a value of the tabindex attribute.

Example :

<h3 tabindex="2">This is a heading</h3>
 
<a href="https://www.webplover.com" tabindex="1">WebPlover</a>
 
<p tabindex="3">This is a paragraph</p>
Result

This is a heading

WebPlover

This is a paragraph

 

Example Explaining

In the above example we have used the tabindex attribute in <h3>, <a> and <p> tags.

  • In the <h3> tag, value of the tabindex attribute is 2.
  • In the <a> tag, value of the tabindex attribute is 1.
  • In the <p> tag, value of the tabindex attribute is 3.

Now by pressing the Tab key at first time (on this page), the <h3> element will be focused.

By pressing the Tab key at second time (on this page), the <a> element will be focused.

By pressing the Tab key at third time (on this page), the <p> element will be focused.

Note :

The elements will be focused in the sequence of numbers.

I.e. if we have three elements with the tabindex=”2″, tabindex=”5″ and tabindex=”7″ attributes.

Now by pressing the Tab key, tabindex=”2″ element will be focused first, then tabindex=”5″, then tabindex=”7″ with the sequence of numbers.

Here are a few tutorials for you to read next:

If you find this tutorial helpful, then please Subscribe to our YouTube Channel for video tutorials, and share this article on social media.

Was this post helpful?
Let us know if you liked the post. That’s the only way we can improve.
Yes0
No0
Powered by Helpful

Leave a Comment

Your email address will not be published. Required fields are marked *