w3resource

HTML tabindex attribute

tabindex

The purpose of the HTML tabindex attribute is to specify a number which indicates the order according to which a position gets focus when the user tabs through the page. The range of the value must be a number between 0 and 32767. Leading zeros are ignored by the user agents.

Supported elements

HTML tabindex attribute supports a, area, button, input, object, select, textarea element.

Syntax

<ElementName summary="value" >.....</ElementName>

Where ElementName is any supported element.

Type of value

Integer.

Value

An integer between 0 and 32767.

Default value

There is no default value of HTML tabindex attribute.

Supported doctypes

HTML 4.01 strict, HTML 4.01 transitional, HTML 4.01 frameset.

Example of HTML tabindex attribute with button, input, select, textarea elements

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Example of HTML tabindex attribute with button, input, select, textarea elements</title>
</head>
<body>
<form name="user_info" action="action_get.php" method="get"> 
Name : <input type="text" name="name" tabindex="1"><br>
email  : <input type="text" name="email" tabindex="2"><br>
<label>Select your favourite sports</label> 
<select size="2" tabindex="3">
<option value="Soccer">Soccer</option>
<option value="Hockey">Hockey</option>
<option value="Tennis">Tennis</option>
<option value="Golf">Golf</option>
</select><br>
<label>Why do you like this sport? </label> <br>
<textarea name="description" tabindex="4" rows="10" cols="5"></textarea><br>
<button type="submit" name="submit"  tabindex="5"/>Submit</button>
</form>
</body>
</html>

Result

html tabindex attribute with button input select textarea elements

View this example in a separate browser window

Example of HTML tabindex attribute with form elements

Previous: HTML summary attribute
Next: HTML target attribute

Test your Programming skills with w3resource's quiz.



Become a Patron!

Follow us on Facebook and Twitter for latest update.

It will be nice if you may share this link in any developer community or anywhere else, from where other developers may find this content. Thanks.

https://www.w3resource.com/html/attributes/html-tabindex-attribute.php