HTML Forms Design Or
Building
http://knowledgediarybd.com/html-forms/
HTML Forms design
or building is an
important subject in web design.To collect user information specially in
case of dynamic & database based web site for log in or sign up
system even in voting system,contact information a HTML form is used . That’s why it is more
important in web developing.
A HTML Forms are formed with a various element.
These are:
1.Text Box
2.Text Area
3.Radio Button
4.Check Box
5.Drop Down List
6. Submit Button
HTML From code design template and example:
<html>
<head>
<title>
www.knowledgediarybd.com</title>
</head>
<body
bordercolor="#990000" bgcolor="#9966FF">
<!–For From heading–>
<h1
align="center"><u> Registration Form </u></h1>
<!–starting HTML from Here –>
<form action=”Registration form.php”
method=”post”>
<!–For First Name,Last
Name,Age,E-mail,Password –>
<!–-for Text area and Text box–->
<p align="center">
<table align="center">
<tr><td>First
name:</td> <td><input type=”text”
name=”firstname”/><br></td></tr>
<tr><td>Last name:
</td> <td><input type=”text”
name=”lastname”/><br></td></tr>
<tr><td>Age: </td>
<td><input name=”age” type=”text” id=”age”
/><br></td></tr>
<tr><td>E-mail: </td>
<td><input name=”e-mail” type=”text”
id=”e-mail”/><br></td></tr>
<tr><td>Password:
</td> <td><input name=”password” type=”text” id=”password”
/></td></tr>
</table>
</p>
<!–end of Text area and Text
box–>
<!–for Radio Button–>
<p align="center">
<table align="center">
<tr>
<td>SEX::</td>
<td><input type="radio" name="sex"
value="male" /> Male <br></td>
<td><input
type="radio" name="sex" value="female"
/>Female<br></td>
</tr>
</table>
</p>
<!–end of Radio Button–>
<!–for checkbox–>
<p align="center">
<table align="center">
<tr>
<td> Checkbox:</td>
<td><input type="checkbox" name="student"
value="student"/>I am a student<br></td>
<td><input
type="checkbox" name="business man" value="business
man"/>I am a business man<br></td>
</tr>
</table>
</p>
<!–end checkbox–>
<!– For Drop Down List–>
<p
align="center">Birthday: </p>
<div align="center">
<label> Day:
<select name=”day” size=”1″
id=”day”>
<option selected=”selected”>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
<option>13</option>
<option>14</option>
<option>15</option>
<option>16</option>
<option>17</option>
<option>18</option>
<option>19</option>
<option>20</option>
<option>21</option>
<option>22</option>
<option>23</option>
<option>24</option>
<option>25</option>
<option>26</option>
<option>27</option>
<option>28</option>
<option>29</option>
<option>30</option>
<option>31</option>
</select>
</label>
<label>
Month:
<select name=”month” size=”1″
id=”month”>
<option
selected=”selected”>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
<option>6</option>
<option>7</option>
<option>8</option>
<option>9</option>
<option>10</option>
<option>11</option>
<option>12</option>
</select>
</label>
<label>
Year:
<select name=”year” size=”1″ id=”year”>
<option>1990</option>
<option>1991</option>
<option>1992</option>
<option>1993</option>
<option>1994</option>
<option>1995</option>
<option>1996</option>
<option>1997</option>
<option>1998</option>
<option>1999</option>
<option>2000</option>
<option>2001</option>
<option>2002</option>
<option>2003</option>
<option>2004</option>
<option>2005</option>
<option>2006</option>
<option>2007</option>
<option>2008</option>
<option>2009</option>
<option>2010</option>
<option>2011</option>
<option>2012</option>
<option>2013</option>
</select>
</label>
</div>
<!–end of Drop Down List–>
<!–For submit Button–>
<p align="center">
<label> Submit Buttton:
<input type="submit"
value="Submit" />
</label>
</p>
<!–end of submit button–>
<p align="center">
<label> Reset Buttton:
<input type="reset"
value="Reset" />
</label>
</p>
</form>
<!–end of from–>
</body>
</html>
No comments:
Post a Comment