Maret 29, 2017
Membuat Form dengan HTML
Hallo Gaes, Kembali lagi di blog saya. kali ini saya akan memberitahukan mengenai contoh membuat form pendaftaran lewat HTML. yo langsung saja buka aplikasi untuk untuk menulis seperti notepad/notepad++ tetapi kali ini saya menggunakan sublime untuk menuliskan kodingan saya. silahkan tulis koding yang ada di bawah ini :
<!DOCTYPE html>
<html>
<head>
<title></title>
</head>
<body>
<table border="1" width="80%" align="center">
<tr>
<td colspan=2><img src="tif.jpg" width="100%" height="80px"></td>
</tr>
<tr>
<td width="20%">
<tr>
<td bgcolor="cyan">
<ul>
<li><a href=#>HOME</a></li>
<li><a href=#>PENDAFTARAN</a></li>
<li><a href=#>ABOUT ME</a></li>
</ul>
</td>
</td>
<td bgcolor="grey"><center>FORM PENDAFTARAN</center>
<form>
Nama : <br> <input type="text" name="nama" width="80px"><br><br>
Alamat : <br> <textarea rows=4 cols=40></textarea><br><br>
Email : <br> <input type="email" name="email"><br><br>
Agama : <br> <input type="radio" name="agama" checked>Islam
<input type="radio" name="agama">Kristen
<input type="radio" name="agama">Hindu
<input type="radio" name="agama">Buddha <br><br>
Jenis kelamin : <br>
<input type="radio" name="sex" checked> Laki-laki
<input type="radio" name="sex"> Perempuan
</td>
</form>
</td>
</tr>
<tr>
<td colspan=2 align="center" bgcolor="aaa">Program studi Teknik informatika universitas ahmad dahlan
</tr>
</table>
</body>
</html>
Dan hasil ketika dibuka lewat browser adalah seperti ini...
Menambah koding Form Pendaftaran dengan CSS
Pengertian CSS
Dalam bahasa bakunya, seperti di kutip dari wikipedia, CSS adalah “kumpulan
kode yang digunakan untuk mendefenisikan desain dari bahasa markup” , dimana
bahasa markup ini salah satunya adalah HTML.
Untuk pengertian bebasnya, CSS adalah kumpulan
kode program yang digunakan untuk mendesain atau mempercantik tampilan halaman
HTML. Dengan CSS kita bisa mengubah desain dari text, warna, gambar dan latar
belakang dari (hampir) semua kode tag HTML.
CSS biasanya selalu dikaitkan dengan HTML, karena
keduanya memang saling melengkapi. HTML ditujukan untuk membuat struktur,
atau konten dari halaman web. Sedangkan CSS digunakan untuk tampilan dari
halaman web tersebut. Istilahnya, “HTML for content, CSS for Presentation”.
Fungsi dan Kegunaan CSS
Awal mula diperlukannya CSS dikarenakan kebutuhan
akan halaman web yang semakin kompleks. Pada awal kemunculan HTML, kita bisa
membuat suatu paragraf bewarna merah dengan menulis langsung kode tersebut
didalam tag HTML, atau membuat latar belakang sebuah halaman dengan warna
biru,merah dan lain-lain. Langsung saja ketik koding di bawah ini
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.format {
color: orange;
font-style: italic; font-family: arial;
}
</style>
</head>
<body>
<table border="1" width="80%"
align="center">
<tr>
<td colspan=2><img src="uad.jpg"
width="20%" height="200px"></td>
</tr>
<td width="20%">
<tr>
<td bgcolor="cyan">
<ul>
<li><a
href=#>HOME</a></li>
<li><a
href=#>PENDAFTARAN</a></li>
<li><a href=#>ABOUT
ME</a></li>
</ul>
</td>
</td>
<td bgcolor="grey"><center>
<span class=format>FORM PENDAFTARAN</span>
</center>
<form>
<span class=format> Nama </span>:
<br> <input type="text" name="nama"
width="80px"><br><br>
<span class=format> Alamat </span>:
<br> <textarea rows=4 cols=40></textarea><br><br>
<span class=format> Email </span>:
<br> <input type="email"
name="email"><br><br>
<span class=format> Agama </span>:
<br> <input type="radio" name="agama"
checked>Islam
<input type="radio"
name="agama">Kristen
<input type="radio"
name="agama">Hindu
<input type="radio"
name="agama">Buddha <br><br>
<span class=format> Jenis kelamin
</span>: <br>
<input type="radio"
name="sex" checked> Laki-laki
<input type="radio"
name="sex"> Perempuan
</td>
</form>
</td>
</tr>
<tr>
<td colspan=2 align="center"
bgcolor="cyan">Program studi Teknik informatika universitas ahmad
dahlan
</tr>
</table>
</body>
</html>
dan hasilnya adalah seperti ini..
Yaa cukup sekian postingan saya kali ini semoga bermanfaat
B)
0 komentar:
Posting Komentar