Tuesday, April 7, 2015

Membuat Biodata Dengan HTML

Di semester lalu aku masuk mata kuliah Pemograman Web dan kami mempelajari banyak hal, salah satunya adalah HTML. (*^ワ^*)
Hypertext Markup Language (HTML) merupakan bahasa markup paling popular dan salah satu bahasa pemrograman yang untuk mengaplikasikannya tidak memerlukan web server, atau bahasa pemrograman yang berjalan di sisi client. 

Nah sekarang aku akan nunjukin bagaimana aku membuat tugas biodata siswa dikelas itu~!
Buka notepad dan masukkan listing yang dibawah:

------------------------------------------------------------

<html>
<head>
<title> Contoh Form Biodata</title>
</head>
<body background="cover2.jpg">
<font color="Papayawhip">
<h1> Biodata Mahasiswa </h1>
<hr width="100%" size="10" color="orange"><br>
<form method="post" action="formsimpan.html">
<table>
<tr><td>Nama:</td> <td><input type="text" name="nama" size="30"></td>
</tr>
<tr><td>NIM:</td> <td><input type="text" name="nim" size="9"></td>
</tr>
<tr><td>Tempat/Tgl Lahir:</td> <td><input type="text" name="ttl" size="20"></td>
</tr>
<tr><td>Jenis Kelamin:</td> <td><input type="radio" name="sex" value="L">Laki-laki
<input type="radio" name="sex" value="P">Perempuan
<input type="radio" name="sex" value="GJ">Gak jelas</td>
<tr><td>Alamat:</td> <td><textarea cols="25" rows="5"></textarea></td>
</tr>
</tr>
<tr><td>Agama:</td> <td><select name="agama"><option value="islam">islam
    <option value="kristen">kristen
    <option value="katholik">katholik
    <option value="hindu">hindu
    <option value="budha">budha</select></td>
</tr>
<tr><td>Email:</td> <td><input type="text" name="email" size="30"></td>
</tr>
<tr><td>Web/Blog:</td> <td><input type="text" name="web" size="30"></td>
<tr><td>Ijasah yang dimiliki:</td> <td><input type="checkbox" name="ijasah" value="sd">SD<br>
<input type="checkbox" name="ijasah" value="sltp">SLTP<br>
<input type="checkbox" name="ijasah" value="slta">SLTA<br>
<input type="checkbox" name="ijasah" value="diploma">Diploma<br>
<input type="checkbox" name="ijasah" value="sarjana">Sarjana</td>
</tr>
<tr><td>PENGALAMAN BERORGANISASI:</td> <td><textarea rows="7" cols="40"></textarea></td>
</tr>
</table>
<input type="submit" value="Simpan" name="t1">
<input type="reset" value="Reset" name="t2">
<br>
<hr size="5" width="100%" color="orange"></font>
<font color="papayawhip">By Ananda Ditha S.N</font>
</form>
</body>
</html>

------------------------------------------------------------------------------------------------------

Kemudian simpan notepad dalam bentuk HTML(.html). Selesai! Oh ya, background tampilannya bisa kalian ganti sendiri sesuka kalian. Ini tampilan dari listing diatas :)


Selamat Mencoba~!



No comments:

Post a Comment