Skip to content
Related Articles

Related Articles

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

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :