Minggu, 24 Juni 2012

 
Pada posting saya sebelumnya saya sudah membahas cara membuat tabel di html sekarang kita melanjutkan ke tahap berikutnya adalah membuat form. Formulir sering digunakan untuk membuat rtanyaan atau komentar bagi pengunjung web atau blog. Form ini juga bisa diberi variasi warna sesuai yang Anda sukai. Saya akan membahas cara membuat beberapa form yaitu form input, form checkbox dan form radio.
     1.  Form Input 

<html>
<head>
   <title> Belajar membuat Form </title>
</head>
<body>
<form>
 Nama :<input name="realname">
 <br>
 Usia  :<input usia="usia">
 <br>
 Alamat : <input alamat="alamat"> 
</form>
</body>
</html>
2   2. Form checkbox
           Form checkbox adalh form yang dapt diisi beberapa jawaban. berikut tampilan dan cara membuat for checkbox

<html>
<head>
   <title> Belajar membuat Form </title>
</head>
<body>
<form>
<b>3. Jika kami melakukan pembaruan tampilan website <br>
  bagian apa yang harus kami ganti/tambah?</b>
<br>
<input name="pembaruan" type="checkbox"> Tambilan Header
<br>
<input name="pembaruan" type="checkbox"> Penyusunan artikel
<br>
<input name="pembaruan" type="checkbox"> Katalog
<br>
<input name="pembaruan" type="checkbox"> Buku tamu
<br>
lainnya<input lainnya="lain">
</form>
</body>
</html>
      3. Form Radio
              Form radio adalah form yang hanya dapat diisi salah satu saja. berikut tampilan form radio dan cara membuatnya.


<html>
<head>
   <title> Belajar membuat Form </title>
</head>
<body>
<form>
<b>2. Bagamaimana pendapat anda tentang website kami?</b>
<br>
<input name="tampilan" type="radio">Tidak Menarik
<br>
<input name="tampilan" type="radio">kurang menarik
<br>
<input name="tampilan" type="radio"> Menarik
<br>
<input name="tampilan" type="radio">Sangat Menarik
</form
</body>
</html>
4. Membuat tombol Submit Dan Clear
 
Ketika membuat sebuah form kita akan memiliki tombol untuk mengirimkan dan reset. 
baiklah berikut cara untuk membuat tombol clear dan submit pada sebuah form html.

<html>
<head>
   <title> Belajar membuat Form </title>
</head>
<body>
<form>
 Nama :<input name="realname">
 <br>
 Usia  :<input usia="usia">
 <br>
  Alamat : <input alamat="alamat">
 <br>
<b>3. Jika kami melakukan pembaruan tampilan website <br>
      bagian apa yang harus kami ganti/tambah?</b>
<br>
<input name="pembaruan" type="checkbox"> Tambilan Header
<br>
<input name="pembaruan" type="checkbox"> Penyusunan artikel
<br>
<input name="pembaruan" type="checkbox"> Katalog
<br>
<input name="pembaruan" type="checkbox"> Buku tamu
<br>
<b>2. Bagamaimana pendapat anda tentang website kami?</b>
<br>
<input name="tampilan" type="radio">Tidak Menarik
<br>
<input name="tampilan" type="radio">kurang menarik
<br>
<input name="tampilan" type="radio"> Menarik
<br>
<input name="tampilan" type="radio">Sangat Menarik
<br>
<input value="Submit" type="submit"> <input value="Clear" type="reset">
</form>
</body>
</html>
5. Membuat tabel
Untuk mempercantik sebuah form dapat diberi warana sesuai keinginan.
<html>
<head>
   <title> Belajar membuat Form </title>
</head>
<body>
<form>
 <table bgcolor="#ffbf00" border="1" cellpadding="3" cellspacing="5">
  <tbody><tr>
  <td> Nama :&nbsp;<input name="realname"> </td>
  <td rowspan="5">&gt;&gt;&gt; Catatan Khusus Pengunjung &lt;&lt;&lt;
  <br>
  <textarea cols="25" rows="5" tabindex="4"> </textarea>
  </td>
  </tr>
  <tr>
  <td> Email &nbsp;:&nbsp;<input name="email"> </td>
  </tr>
  <tr>
  <td> Usia &nbsp;&nbsp;:
    <select>
      <option selected="selected">
      </option><option value="us"> 10th - 15 th
      </option><option value="us"> 16th-20th
      </option><option value="us"> 20th-25th
      </option><option value="us"> 25th-30th
      </option><option value="us"> 35th-40th
      </option><option value="us"> 45th-25th
      </option><option value="us"> &gt; 50 th
   </option></select>
 </td></tr></tbody></table>
</form>
<table bgcolor="#ffbf00" border="1" cellpadding="3" cellspacing="5">
<tr>
<td>
<form>
<b>1. Jenis Kelamin</b>
<br>
<input name="jk" type="radio"> Laki-Laki
<input name="jk" type="radio"> Perempuan
<br>
<b>2. Bagamaimana pendapat anda tentang website kami?</b>
<br>
<input name="tampilan" type="radio">Tidak Menarik
<br>
<input name="tampilan" type="radio">kurang menarik
<br>
<input name="tampilan" type="radio"> Menarik
<br>
<input name="tampilan" type="radio">Sangat Menarik
<br>
<b>3. Jika kami melakukan pembaruan tampilan website <br>
  bagian apa yang harus kami ganti/tambah?
</b>
<br>
<input name="pembaruan" type="checkbox"> Tambilan Header
<br>
<input name="pembaruan" type="checkbox"> Penyusunan artikel
<br>
<input name="pembaruan" type="checkbox"> Katalog
<br>
<input name="pembaruan" type="checkbox"> Buku tamu
<br>
lainnya<input lainnya="lain">
<br>
<input value="Submit" type="submit"> <input value="Clear" type="reset">
</table>
</form>
</body>
</html>

0 comments :

Posting Komentar