HTML Form tags | infotech solution blog
HTML Form tags | infotech solution blog
HTML Forms are required, when you want to collect some data from the site visitor. For example, during user registration you would like to collect information such as name, email address, credit card, etc.
A form will take input from the site visitor and then will post it to a back-end application such as CGI, ASP Script or PHP script etc. The back-end application will perform required processing on the passed data based on defined business logic inside the application.
There are various form elements available like text fields, textarea fields, drop-down menus, radio buttons, checkboxes, etc.
The HTML <form> tag is used to create an HTML form and it has following syntax −
HTML Form Controls
There are different types of form controls that you can use to collect data using HTML form −
Text Input Controls
Checkboxes Controls
Radio Box Controls
Select Box Controls
File Select boxes
Hidden Controls
Clickable Buttons
Submit and Reset Button
<form action = "Script URL" method = "GET|POST">
form elements like input, textarea etc.
</form>
Create form using this tags
<!doctype html>
<html>
<head>
<title> form </title>
</head>
<body>
<form action="submit-form.html" method="post">
<table align="center" width="80%"
bgcolor="#CCCCCC" cellspacing="0px" border="1px" cellpadding="5px">
<tr>
<th colspan="2"> <font color="#000000" face="Geneva" size="+3">
Registraction Form </font> </th>
</tr>
<tr>
<td height="30px" width="30%"> Name: </td>
<td height="30px" width="70%">
<input type="text" name="name" required="" placeholder="Enter Your Full Name">
</td>
</tr>
<tr>
<td height="30px" width="30%"> Name: </td>
<td height="30px" width="70%">
<input type="text" name="name" readonly placeholder="Enter Your Full Name">
</td>
</tr>
<tr>
<td height="30px" width="30%"> Name: </td>
<td height="30px" width="70%">
<input type="hidden" name="name" placeholder="Enter Your Full Name">
</td>
</tr>
<tr>
<td height="30px" width="30%"> Email ID: </td>
<td height="30px" width="70%">
<input type="email" name="email" required="" placeholder="Enter Your Email Id">
</td>
</tr>
<tr>
<td height="30px" width="30%"> Password: </td>
<td height="30px" width="70%">
<input type="password" name="email" placeholder="Enter Your Password">
</td>
</tr>
<tr>
<td height="30px" width="30%"> Gender </td>
<td height="30px" width="70%">
Male<input type="radio" name="g"> Female<input name="g" type="radio">
</td>
</tr>
<tr>
<td height="30px" width="30%"> Date Of Birth </td>
<td height="30px" width="70%">
<select name="Day">
<option value="0"> Day </option>
<option value="1"> 1 </option>
<option value="2"> 2 </option>
<option value="3"> 3 </option>
<option value="4"> 4 </option>
<option value="5"> 5 </option>
<option value="6"> 6 </option>
<option value="7"> 7 </option>
<option value="8"> 8 </option>
<option value="9"> 9 </option>
<option value="10"> 10 </option>
<option value="11"> 11 </option>
<option value="12"> 12 </option>
</select>
<select name="month">
<option value="0"> Month </option>
<option value="1"> Jan </option>
<option value="2"> Feb </option>
<option value="3"> March </option>
<option value="4"> April </option>
<option value="5"> May </option>
<option value="6"> June </option>
<option value="7"> July </option>
<option value="8"> Aug </option>
<option value="9"> Sept </option>
<option value="10"> Oct </option>
<option value="11"> Nev </option>
<option value="12"> Dec </option>
</select>
<select name="Year">
<option value="0"> Year </option>
<option value="1"> 1990 </option>
<option value="2"> 1991 </option>
<option value="3"> 1992</option>
<option value="4"> 1993 </option>
<option value="5"> 1994 </option>
<option value="6"> 1995 </option>
<option value="7"> 1996 </option>
<option value="8"> 1997 </option>
<option value="9"> 1998 </option>
<option value="10"> 1999 </option>
<option value="11"> 2000 </option>
<option value="12"> 2001 </option>
</select>
</td>
</tr>
<tr>
<td> Your Hobies</td>
<td> Cricket
<input type="checkbox" name="cricket"> Plying Games <input type="checkbox" name="cricket">
Dancing <input type="checkbox" name="dancing">
Designing<input type="checkbox" name="Designing">
Reading<input type="checkbox" name="Reading">
</td>
</tr>
<tr>
<td> Photo </td>
<td> <input type="file" name="photo"> </td>
</tr>
<tr>
<td> Calendar </td>
<td> <input type="date" name="date"> </td>
</tr>
<tr>
<td> Colour </td>
<td> <input type="color" name="color" value="red"> </td>
</tr>
<tr>
<td> Range </td>
<td> <input type="range" name="range" value="0"> </td>
</tr>
<tr>
<td> </td>
<td> <button type="submit" name="submit"> Save </button>
<input type="submit" name="submit" value="Submit">
<input type="reset" name="submit" value="Reset"></td>
</tr>
</table>
</form>
</body>
</html>
Labels
HTML
Post A Comment
No comments :
Thanks For visiting Infotech Solutuion Blog