Cara Membuat Form dan Tabel Sederhana
Kali ini saya akan berbagi sedikit source code yang bisa kita manfaatkan untuk menambah referensi membuat sebuah halaman, form dan juga tabel.
1. Source Code Membuat Form Sederhana
Berikut scriptnya, tinggal copy-paste dan simpan dengan extensi .html :
<!DOCTYPE html>
<head>
<meta charset="UTF-8">
<title>Membuat Form</title>
</head>
<body>
<h2>Form Registrasi</h2>
<form action="" method="POST">
<table>
<tr>
<td>Nama: *</td><td><input type="text" name="nama" required autofocus></td>
</tr>
<tr>
<td>Tanggal lahirL</td>
<td><input type="date" name="date" min="1900-01-01" required></td>
</tr>
<tr>
<td>Email:</td>
<td><input type="email" name="email" placeholder="domain@domain.com"></td>
</tr>
<tr>
<td>Jarak rumah ke kampus:</td>
<td><input type="range" name="jarak" id="slider" value="" min="0" max="100" step="10"></td>
</tr>
<tr>
<td>Warna Favorit</td>
<td><input type="color" name="warna" value=""></td>
</tr>
<tr>
<td>Hobby (Boleh pilih lebih dari satu)</td>
<td><input type="text" name="hobi" placeholder="hobi" list="hobii"></td>
<datalist id="hobii">
<option>Makan</option>
<option>Tidur</option>
<option>Belajar</option>
<option>Gak Punya Hobi</option>
<option>Semua benar</option>
</datalist>
</tr>
<tr>
<td>Foto:</td>
<td><input type="file" name="upload" accept=".jpg,.png,.jpeg"></td>
</tr>
<tr>
<td><input type="submit" name="simpan" value="simpan"></td>
</tr>
</table>
</form>
</body>
</html>
2. Source Code Membuat Tabel Sederhana
Berikut scriptnya, tinggal copy-paste dan simpan dengan extensi .html :
<html>
<head>
<title>Membuat Tabel</title>
</head>
<body>
<h2>Tabel Untuk Semester</h2>
<table style="width:600px;" border="1">
<tr style="background-color:#cfcfcf">
<th>SEMESTER</th>
<th>IPS</th>
</tr>
<tr>
<td style="text-align:center;">SEMESTER 1</td><td style="text-align:right">3.4</td>
</tr>
<tr>
<td style="text-align:center;">SEMESTER 2</td><td style="text-align:right">3.5</td>
</tr>
<tr>
<td style="text-align:center;">SEMESTER 3</td><td style="text-align:right">3.6</td>
</tr>
<tr>
<td style="text-align:center;">SEMESTER 4</td><td style="text-align:right">3.9</td>
</tr>
<tr style="text-align:right;background-color=#FFCBCB;font-weight:bold">
<td style="text-align:center;">NILAI IPK >>></td>
<td style="text-align:center;">3.7</td>
</tr>
</table>
</body>
</html>
Saya juga sediakan source codenya langsung DISINI, silakan bisa anda download secara free. semoga bermanfaat, salam..belajar gretongan meskipun sedikit. hehe
Jangan lupa juga baca juga selengkapnya modul-modul pemrograman lainnya DISINI
1. Dilarang komentar SARA
2. Promosi boleh tapi dengan syarat (no sex, judi dan hal yang terlarang lainnya)
3. Cukup perhatikan nomor 1 dan 2 saja
4. Thank you for visiting