Praktek Membuat Table dan Form HTML
MEMBUAT TABLE DAN FORM PADA HTML
Halo semuanya, kali ini saya akan mempraktekkan cara membuat table dan form pada HTML.
pendaftaran.html
<!DOCTYPE> <html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Pendaftaran Akademi</title>
</head>
<body>
<table border="2" align="center" cellpadding="10">
<tr>
<th colspan="4"><img src="chelsea.png" align="center" style="width: 100px; height: 100px"> Pendaftaran Akademi Sepakbola Chelsea Indonesia</th>
</tr>
<tr>
<th>Kelompok Umur</th>
<th>Biaya Pendaftaran</th>
<th>Fasilitas</th>
<th>Iuran Perbulan</th>
</tr>
<tr>
<td>Umur 6-12</td>
<td>Rp 2.000.000</td>
<td>Lapangan latihan, pelatih, dan jersey</td>
<td rowspan="4">Rp 500.000</td>
</tr>
<tr>
<td>Umur 14-16</td>
<td>Rp 2.500.000</td>
<td>Lapangan latihan, pelatih, dan jersey</td>
</tr>
<tr>
<td>Umur 16-18</td>
<td>Rp 4.000.000</td>
<td>Lapangan latihan, pelatih, string bag, dan jersey</td>
</tr>
<tr>
<td>Umur 19-21</td>
<td>Rp 6.000.000</td>
<td>Lapangan latihan, pelatih, string bag, sepatu, dan jersey</td>
</tr>
<tr>
<td colspan="4" align="center">Ayo segera daftar sekarang juga dengan klik <a href="formulir.html"> <input type='submit' name='tombol' value='disini'/></a>
</td>
</tr>
</table>
</body>
</html>
Hasil :
2. Setelah membuat tampilan awal, kemudian buat formulir dengan nama file formulir.html berikut sintaks :
formulir.html
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scaled=1">
<title>Formulir Pendaftaran</title>
</head>
<body>
<form>
<table border="2" align="center" cellpadding="10">
<tr>
<th colspan="2">PENDAFTARAN AKADEMI CHELSEA</th>
</tr>
<tr>
<td>Nama Lengkap</td>
<td><input type="text" name="nama lengkap" placeholder="Masukkan Nama Lengkap"></td>
</tr>
<tr>
<td>Tanggal Lahir</td>
<td><input type="date" name="tanggal lahir"/></td>
</tr>
<tr>
<td>Umur</td>
<td><input type="number" min="5" max="30" name="umur" placeholder="Umur"/></td>
</tr>
<tr>
<td>Alamat</td>
<td><input type="textarea" name="alamat" placeholder="Masukkan Alamat"/></td>
</tr>
<tr>
<td colspan="2" align="center"><input type="reset" value="Reset"> <input type="button" name="Pesan" value="Kirim" /></td>
</tr>
</table>
</form>
</body>
</html>
hasil :
.png)
.png)
Komentar
Posting Komentar