Sabtu, 29 Maret 2014

Membuat Form HTML


Untuk membuat form seperti diatas kode htmlnya adalah sebagai berikut :

<!DOCTYPE html>

<head>
<title>Belajar membuat form</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"><style type="text/css">
<!--
body {
                background-color: #FF0066;
}
body,td,th {
                color: #000000;
}
-->
</style></head>

<body style='background:#FF99FF'>
 <div style="background:#D4D4D4;width:600px; margin:50px auto 0px auto;padding:10px;border-radius:4px;">
   <h2 style='background:#FF0066;color:#000000;padding:10px;margin:-10px -10px 0px -10px;text-align:center'>CURRICULUM VITAE</h2>
  <fieldset>
   <legend style="font-family:arial;"><strong>IDENTITAS DIRI</strong></legend>
    <form action="tampil.php">
     <table>
     
      <tr>
        <td width="191">Nama Lengkap</td>
        <td width="167"><input type="text" name="Nama Lengkap"/></td></tr>
      <tr>
        <td>Tempat/Tanggal Lahir</td>
        <td><input type="text" name="nama"/></td>
        <td><label>
          <select name="select" id="select">
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="16">16</option>
          </select>
          <select name="select2" id="select2">
            <option value="Jan">Jan</option>
            <option value="Feb">Feb</option>
                    </select>
          <select name="select3" id="select3">
            <option value="1993">1993</option>
            <option value="1994">1994</option>
            <option value="1995">1995</option>
                    </select>
        </label></td>
      <tr><td>Jenis Kelamin</td><td><input type="radio" name="kelamin" value="laki-laki">Pria
          <input type="radio" name="kelamin" value="Perempuan">
          Wanita</td><td width="190">&nbsp;</td>
      <tr>
        <td>Agama</td><td><input type="text" name="jurusan"/></td></tr>
      <tr>
        <td>Alamat</td>
        <td><input type="text" name="ipk"/></td>
      </tr>
      <tr>
        <td>Kewarganegaraan</td><td><label>
          <input type="checkbox" name="checkbox" id="checkbox">
          WNI
          <input type="checkbox" name="checkbox2" id="checkbox2">
          WNA</label></td></tr>
     
      <tr><td><input type="submit" value="kirim"/>
        <input type="reset" value="batalkan"/></td>
       </tr>
     </table>
    </form>
  </fieldset>
</div>
</body>


</html>






2. Untuk menampilkan hasil form kode php nya adalah sebagai berikut :


<h1 align='center' style='text-align:left'>CURRICULUM VITAE</h1></br></br>
<style type="text/css">
<!--
body {
background-color: #FF99FF;
}
-->
</style><body style='background:#FF99FF>
<div style='background:#f2f2f2;width:600px; margin:0 auto'>
<fieldset>
<legend style='font-family:arial;'>IDENTITAS PRIBADI</legend>
<table>
<tr bordercolor="#FF0066" bgcolor="#FF0066"><td width="132">Nama Lengkap</td>
<td width="183">:</td>
 </tr>
<tr bordercolor="#FF0066" bgcolor="#FF0066"><td>Tempat/Tanggal Lahir</td>
<td>:</td>
 </tr>
<tr bordercolor="#FF0066" bgcolor="#FF0066"><td>Jenis Kelamin</td>
<td>:</td>
 </tr>
<tr bordercolor="#FF0066" bgcolor="#FF0066"><td>Agama</td>
 <td>:</td>
 </tr>
<tr bordercolor="#FF0066" bgcolor="#FF0066">
 <td>Alamat</td>
 <td>:</td>
 </tr>
<tr bordercolor="#FF0066" bgcolor="#FF0066">
 <td>Kewarganegaraan</td>
 <td>:</td>
 </tr>
</table>
</fieldset>
</div>

</body>

0 komentar:

Posting Komentar

Terimakasih Atas Kunjungan Anda.Silahkan Tinggalkan Komentar dan Follow My Twitter