HTML | form Tag

Difficulty Level : Basic
Last Updated : 17 Jul, 2019

The <form> tag in HTML is used to create form for user input. There are many elements which are used within form tag. For example: <input>, <textarea>, <button>, <select>, <option>, <optgroup>, <fieldset>, <label>.

Syntax:

<form> Form Content... </form>

Attributes: There are many attributes which are associated with <form> tag. Some of them are listed below:

input: It is used to specify the input field for user.
textarea: It is used to specify for multi-line text input field for user.
button: It is used to perform an operation in a form by the user.
label: It is used to give label to any tag like button, input etc.

Example 1:

<!DOCTYPE html> 
<html> 
    <head> 
        <title>form tag</title> 
        <style> 
            body { 
                text-align:center; 
            } 
            h1 { 
                color:green; 
            } 
        </style> 
    </head> 
    <body> 
        <h1>GeeksforGeeks</h1> 
        <h2><form> Tag</h2> 
        <form action="#"> 
            First name:  
            <input type="text" placeholder = "First Name"
            value=""> 
            <br><br> 
            Last name:  
            <input type="text" placeholder = "Last Name"
            value=""> 
            <br><br> 
            <input type="submit" value="Submit"> 
        </form> 
    </body> 
</html>                     

Output:

Example 2:

<!DOCTYPE html> 
<html> 
    <head> 
        <title>form tag</title> 
        <style> 
            input { 
                width:95%; 
                height:30px; 
            } 
            button { 
                background-color:green; 
                color:white; 
                border:none; 
                border-radius:5px; 
                font-size:14px; 
                padding:5px; 
                    
            } 
            h1 { 
                color:green; 
            } 
            h1, h2 { 
                text-align:center; 
            } 
            body { 
                width:60%; 
            } 
        </style> 
    </head> 
    <body> 
        <h1>GeeksforGeeks</h1> 
        <h2><form> Tag</h2> 
        <form action="#"> 
        <div class="container"> 
            <h2>Sign Up Form</h2> 
            <b>Email</b><br> 
            <input type="text" placeholder="Enter Email" 
                                  name="email" required> 
            <br><b>Username</b><br> 
            <input type="text" placeholder="Username" 
                                   name="uid" required> 
              
            <br><b>Password</b><br> 
            <input type="password" placeholder="Enter Password" 
                                            name="psw" required> 
            <br><br> 
            <button type="submit" class="registerbtn"> 
                                              Register</button> 
        </div> 
        <div class="container signin"> 
            <p>Already have an account? 
             <a href="#">Sign in.</a></p> 
        </div> 
        </form> 
    </body> 
</html>                     

Output:

Supported Browsers: The browser supported by <form> tag are listed below:

Google Chrome
Internet Explorer
Firefox
Opera
Safari

My Personal Notes

Related Articles