html forms

Updated : 19 Aug 2021 09:41 PM (3 months ago)

forms can be created using form tag

<form action=""></form>

action attribute used to mention to which page  we want to submit the form data.

 

following code created for some basic inputs 

 

<form action="index.html">

                <div class="form-field">

                    Name <br/>

                    <input type="text" name="name"> 

                </div>

                <div class="form-field">

                    Email <br/>

                    <input type="email" name="email"> <br/>

                </div>

                <div class="form-field">

                    Passsword <br/>

                    <input type="password" name="password"> <br/>

                </div>


 

                <div class="form-field">

                    Gender <br/>

                    <select name="gender" id="gender">

                        <option value="">Select Gender</option>

                        <option value="Male">Male</option>

                        <option value="Female">Female</option>

                        <option value="Other">Other</option>

                    </select>

                    <br/><br/>

                    <input type="radio" name="sex" id="sex_male" value="Male"> 

                    <label for="sex_male">Male</label>

                    <br/>

                    

                    <input type="radio" name="sex" id="sex_female" value="Female"> 

                    <label for="sex_female">Female</label>


 

                </div>

                <div class="form-field">

                    Languages <br/>

                    <input type="checkbox" name="lang" id="english">

                    <label for="english">English</label><br/>

                    <input type="checkbox" name="lang" id="hindi">

                    <label for="hindi">Hindi</label><br/>

                    <input type="checkbox" name="lang" id="marathi">

                    <label for="marathi">Marathi</label><br/>

                </div>


 

                

                <div class="form-field">

                    Age <br/>

                    <input type="number" name="age"> <br/>

                </div>

                

                <div class="form-field">

                    DOB <br/>

                    <input type="date" name="dob"> <br/>

                </div>


 

                <input type="search" name="search" id="search"><br/>

                <input type="file"><br/>

                <input type="submit" value="Signup">

            </form>