Skip to content
Related Articles

Related Articles

Improve Article
Save Article
Like Article

HTML autofocus Attribute

  • Difficulty Level : Basic
  • Last Updated : 14 Sep, 2021

Example: In this example, we are using a select autofocus attribute which creates the dropdown for GeeksforGeeks courses.

Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.

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:

The autofocus attribute in HTML is used to specify that the element should get focus when the page loads. It is a boolean attribute.
Note: It supports only the following elements: <button>, <input>, <select> and <textarea>



Supported Tags: 

Syntax: 

<elementName autofocus>

Example 1: 

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

Example 2: 

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

Supported Browsers: 

  • Google Chrome 5.0
  • Internet Explorer 10.0
  • Firefox 4.0
  • Opera 9.6
  • Apple Safari 5.0



My Personal Notes arrow_drop_up
Recommended Articles
Page :

Start Your Coding Journey Now!