Tentunya kalian pernah membuat ID Yahoo atau Gmail dan lain sebagainya, seperti pada gambar berikut :
Bagaimana caranya? Langsung kita masuk ke koding :)
<html>
<head>
<title>Pertemuan 5</title>
</head>
<body>
<form name="formulir" method="post" action="ACO.html">
<center>
<table>
<tr>
<td colspan="2">
<h5 style="width:280px;">Personal</h5>
<hr />
<tr>
<td>Name</td> <td><input type="text" name="Cristoforus" value="" placeholder="First Name">
<input type="text" name="Kaunang" value="" placeholder="Last Name"></td>
</tr>
<tr>
<td>Gender</td>
<td><select style="width:280px;">
<option value="">-Select One-</option>
<option value="html">Male</option>
<option value="html">Female</option>
</select></td>
</tr>
<tr>
<td>Birthday</td>
<td><select>
<option value="">-Select Month-</option>
<option value="html">January</option>
<option value="html">February</option>
<option value="html">March</option>
<option value="html">April</option>
<option value="html">May</option>
<option value="html">Juny</option>
<option value="html">July</option>
<option value="html">August</option>
<option value="html">September</option>
<option value="html">November</option>
<option value="html">December</option>
</select>
<input type="text" name="" value="" style="width:40px;" placeholder="Day">
<input type="text" name="" value="" style="width:40px;" placeholder="Year"></td>
</tr>
<tr>
<td>Country</td>
<td><select>
<option value="">-Select Country-</option>
<option value="html">Argentina</option>
<option value="html">Bahrain</option>
<option value="html">Costa Rica</option>
<option value="html">Denmark</option>
<option value="html">Ethiopia</option>
<option value="html">France</option>
<option value="html">Germany</option>
<option value="html">Hungary</option>
<option value="html">Indonesia</option>
<option value="html">Jamaika</option>
<option value="html">Karibia</option>
</select></td>
</tr>
<tr>
<td>Language</td>
<td><select>
<option value="">-Select Country-</option>
<option value="html">Argentina</option>
<option value="html">Bahrain</option>
<option value="html">Costa Rica</option>
<option value="html">Denmark</option>
<option value="html">Ethiopia</option>
<option value="html">France</option>
<option value="html">Germany</option>
<option value="html">Hungary</option>
<option value="html">Indonesia</option>
<option value="html">Jamaika</option>
<option value="html">Karibia</option>
</select></td>
</tr>
</td>
</tr>
<tr>
<td colspan="2">
<br />
<br />
<h5>Select an ID and Password</h5>
<hr />
<tr>
<td>Itoo! ID and Email</td>
<td><input type="text" name="chester_271291" value="" placeholder="chester_271291">
@
<select>
<option value="">-Select Email-</option>
<option value="html">itoo.com</option>
<option value="html">fapfap.com</option>
</select>
</td>
</tr>
<tr>
<td>Password</td><td><input type="password" name="mautaubanget" value=""></td>
</tr>
<tr>
<td>Re-Type Password</td><td><input type="password" name="mautaubanget" value=""></td>
</tr>
</td>
</tr>
<tr>
<td colspan="2">
<br />
<br />
<h5>In case you forget your ID or Password ... </h5>
<hr />
<tr>
<td>Alternate Email (optional)</td> <td><input type="text" name="" value="" placeholder="Alternate"></td>
</tr>
<tr>
<td>Secret Question 1</td>
<td><select>
<option value="">-Select One-</option>
<option value="html">Susu siapa yang paling enak?</option>
<option value="html">Berapa PIKO meter "punya" Garry Hernandar?</option>
<option value="html">Apa bahan bakar yang baik untuk kendaraan?</option>
</td>
</tr>
<tr>
<td>Your Answer</td> <td><input type="text" name="" value=""></td>
</tr>
<tr>
<td>Secret Question 2</td>
<td><select>
<option value="">-Select One-</option>
<option value="html">Mengapa Wisely Sugianto tidak masuk 2 hari?</option>
<option value="html">Berapa 1 porsi Mie EFSE?</option>
<option value="html">Apa minuman yang baik sehabis makan EFSE?</option>
</td>
</tr>
<tr>
<td>Your Answer</td> <td><input type="text" name="" value=""></td>
</tr>
</td>
</tr>
</table>
</center>
</form>
</body>
</html>
Panjang ya, saya jd males jelasinnya, wkwkwk
Pembuatan ini hanya menggunakan 1 tabel utama. Lalu ada pemakaian <option value.. > itu seperti pembuatan Combo Box yang dapat memilih dari isi Combo Box itu tersebut.
Dan penggunaan tulisan bayangan
<td>Alternate Email (optional)</td> <td><input
type="text" name="" value="" placeholder="Alternate"></td>
<value placeholder> lah yang membuat tulisan "Alternate" bisa menjadi tulisan bayangan.
Sisanya penggunaman gabungan dari List dan Tabel.
Selamat mencoba, Terima Kasih :)
Tidak ada komentar:
Posting Komentar