Cara Buat Form Data Dalam Html
Form
digunakan untuk input data/entri data. Di dalam html terdapat beberapa control
form
yg dapat
digunakan, seperti control text box, list box, password box, text area box,
radio
button,
check box, reset button, submit button, hidden field, file select.
Untuk
membuat form dalam html kita cukup menambahkan tag <form>...</form>
diantara
tag
<body>...</body>,
Control Text Box
Untuk
membuat control text box dalam html kita cukup menambahkan tag <input
/> yg disimpan di antara tag
<form>...</form>
Control List Box
Untuk
membuat list box anda dapat menggungakan tag <select> untuk lebih
jelasnya lihatlah kode di bawah
ini
Control Radio
Button
Anda dapat
menggunakan tag <input> untuk membuat radio button, dengan type
=”radio”.
Control Check
Box
Untuk
membuat check box sama seperti membuat radio button, hanya atribut type
pada tag
input diganti menjadi checkbox, untuk lebih jelasnya lihat kode di bawah
ini.
<style type="text/css">
<!--
.style10 {font-family: Arial, Helvetica, sans-serif;
font-weight: bold; color: #FF0000; }
.style11 {
font-family:
Arial, Helvetica, sans-serif;
color:
#FF9900;
}
.style12 {color: #FF9900}
-->
</style>
<form name="form1" method="post"
action="">
<table
width="750" border="1">
<tr>
<td
width="126" rowspan="3"
bgcolor="#0066FF"> </td>
<td
width="608"><table width="100%"
border="0">
<tr>
<td
width="20%" align="center"
bgcolor="#00FF00"><span
class="style10">HOME</span></td>
<td
width="20%" align="center"
bgcolor="#00FF00"><span
class="style10">REVIEWS</span></td>
<td
width="20%" align="center"
bgcolor="#00FF00"><span class="style10">GALLERY</span></td>
<td
width="20%" align="center"
bgcolor="#00FF00"><span
class="style10">COMMUNITY</span></td>
<td
width="20%" align="center"
bgcolor="#00FF00"><span
class="style10">CONTACT</span></td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="100%" border="0">
<tr>
<td
colspan="2"><span class="style11">Get The VIP
Member</span></td>
</tr>
<tr>
<td
colspan="2"> </td>
</tr>
<tr>
<td
width="26%">Username</td>
<td
width="74%"><label>
<input type="text" name="textfield"
id="textfield">
</label></td>
</tr>
<tr>
<td>Comment</td>
<td><label>
<textarea name="textfield2"
id="textfield2"></textarea>
</label></td>
</tr>
<tr>
<td>Gander </td>
<td><p>
<label>
<input type="radio" name="RadioGroup1"
value="Male" id="RadioGroup1_0">
Male</label>
<br>
<label>
<input type="radio" name="RadioGroup1"
value="Female" id="RadioGroup1_1">
Female</label>
<br>
</p></td>
</tr>
<tr>
<td>favourite</td>
<td><label>
<select name="select" id="select">
<option>action</option>
<option>adventure</option>
<option>horror</option>
<option>rog</option>
</select>
</label></td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="100%" border="0">
<tr>
<td colspan="2"
align="right"><span class="style12">The
Other</span></td>
</tr>
<tr>
<td
colspan="2"> </td>
</tr>
<tr>
<td
width="26%">Hobby</td>
<td
width="74%"><p>
<label>
<input type="radio" name="RadioGroup2"
value="radio" id="RadioGroup2_0">
playing</label>
<br>
<label>
<input type="radio" name="RadioGroup2"
value="radio" id="RadioGroup2_1">
badminton</label>
<br>
<label>
<input type="radio" name="RadioGroup2"
value="radio" id="RadioGroup2_2">
swimming</label>
<br>
</p></td>
</tr>
<tr>
<td>Password</td>
<td><label>
<input
type="password" name="textfield3"
id="textfield3">
</label></td>
</tr>
<tr>
<td> </td>
<td><label>
<input
type="submit" name="button" id="button"
value="Submit">
<input
type="reset" name="button2" id="button2"
value="Reset">
</label></td>
</tr>
</table></td>
</tr>
</table>
</form>
EmoticonEmoticon