Selamat Datang di Website Kami
Guest Book

Thursday 22 March 2012

Creating an HTML Form Various Kinds

04:22 FIRDAUS No comments

On my previous post I already discussed how to create tables in html now we move on to the next stage is make form. Form is often used to create a poll or the comment section for visitors. This form also can be variations in color that you like. I will discuss here is the form input, check boxes and radio form.

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.    Form checkbox
           Form checkbox is a Form that already have the answer we just gave checklist. In the form we  
           can chexbox member checklist some answers. Here's how to make it.

<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 form similar to the radio but in the form checklist form form radio can only be filled with one   
             answer. Typically used unttuk determine gender, religion and others because of this form
             Here carfa create form form radio.



<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 button reset dan submit
When creating a form we would have an additional button member is to submit and reset. In a less complete form without adannya both these functions yaitubutton submit button to indicate that the form has been in the content and ready to be sent while the reset button is to erase all the data form.


<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 form dalam table
To beautify the form of a form can be placed in the table so that the form has the edge barrier and can be given a background color as desired. Here's how to make it.



<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>
Posted in:

0 komentar:

Post a Comment