HTML autofocus Attribute
The autofocus attribute in HTML is used to specify that the element should get focused when the page loads. It is a boolean attribute.
Syntax:
<elementName autofocus>
Note: It supports only the following elements: <button>, <input>, <select> and <textarea>.
Supported Tags:
- Button autofocus Attribute
- Input autofocus Attribute
- Keygen autofocus Attribute
- Select autofocus Attribute
- Textarea autofocus Attribute
Example 1: In this example, we are using a select autofocus attribute which creates the dropdown for GeeksforGeeks courses.
HTML
<!DOCTYPE html><html> <body> <h2>GeeksforGeeks</h2> <p> The select element is used to create a drop-down list. </p> <form> <label for="courses">Select a course:</label> <select name="DSA Self Paced GfG" id="DSA"> <option value="Full Stack Web Technology"> Web Tech </option> <option value="Amazon Interview Preparation"> Amazon </option> <option value="Complete Interview Preparation"> CIP </option> <option value="Google Test Series"> GTS </option> </select> <br><br> <input type="submit" value="Submit"> </form> </body> </html> |
Output:
autofocus attribute
Example 2: This example uses the autofocus attribute to create the focus on the first name while loading the page for the first time.
HTML
<!DOCTYPE html><html> <head> <title>HTML autofocus Attribute</title></head> <body style="text-align: center;"> <h1 style="color: green;">GeeksforGeeks</h1> <h2>HTML autofocus Attribute</h2> <form> <label>First Name: <input type="text" autofocus placeholder="Enter Name"> </label> </form></body> </html> |
Output:
autofocus attribute
Example 3: This example uses the autofocus attribute with the <textarea> tag.
HTML
<!DOCTYPE html><html> <head> <title>HTML autofocus Attribute</title></head> <body style="text-align: center;"> <h1 style="color: green;">GeeksforGeeks</h1> <h2>HTML autofocus Attribute</h2> <textarea rows="3" cols="30" autofocus> A computer science portal for geeks. </textarea></body> </html> |
Output:
autofocus attribute
Supported Browsers:
- Google Chrome 5.0
- Internet Explorer 10.0
- Firefox 4.0
- Opera 9.6
- Safari 5.0
Please Login to comment...