Monday, April 24, 2017

Membuat FORM Pendaftaran dengan HTML




Assalamualaikum Sahabat Blog,disini saya hanya ingin mengajak teman-teman blog untuk berbagi ilmu bagaimana cara membuat Form Pendaftaran sederhana menggunakan HTML.silahkan lihat codingnya dibawah ini

Coding HTML Membuat FORM Pendaftaran
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
 <title>FORM</title>

</head>
<body>
 <table align="center">
  <tr>
   <td bgcolor="green" width="1000" height="50" align="center"><font size="5"><b>FORM REGISTRASI</b></font></td>
  </tr>
 </table>
 <table cellspacing="10" hspace="150">
 </table>
 <table border="0" align="center" width="1000" bgcolor="beige">
 <form>
  <tr>
   <td>NIM</td><td>:</td><td><input type="nim" value="" placeholder=""></td>
  </tr>
  <tr>
   <td>NAMA</td><td>:</td><td><input type="nama" value="" placeholder=""></td>
  </tr>
  <tr>
   <td>JENIS KELAMIN</td><td>:</td><td><input type="radio" name="JK" value="LK">LAKI-LAKI
   <input type="radio" name="JK" value="PR">PEREMPUAN</td>
  </tr>
  <tr>
   <td>ASAL</td><td>:</td><td><select name="ASAL">
      <option value="...">...</option>
      <option value="KJ">KOTA JAMBI</option>
      <option value="MJ">MUARO JAMBI</option>
      <option value="MB">BATANGHARI</option>
      <option value="MB">BUNGO</option>
      <option value="MB">TEBO</option>
      <option value="MB">TANJABBAR</option>
      <option value="MB">TANJABTIM</option>
      <option value="MB">SAROLANGUN</option>
      <option value="MB">KERINCI</option>
      <option value="MB">SUNGAI PENUH</option>
      </select></td>
  </tr>
  <tr>
   <td>NO TELP</td><td>:</td><td><input type="notelp" value="" placeholder=""></td>
  </tr>
  <tr>
   <td>ALAMAT EMAIL</td><td>:</td><td><input type="email" value="" placeholder=""></td>
  </tr>
  <tr>
   <td>PASSWORD</td><td>:</td><td><input type="password" value="" placeholder=""></td>
  </tr>
  <tr>
   <td>HOBBY</td><td>:</td><td><input type="checkbox" name="SepakBola" value="SepakBola"/>SepakBola<br/>
                         <input type="checkbox" name="Futsal" value="Futsal"/>Futsal<br/>
                         <input type="checkbox" name="Berenang" value="Berenang"/>Berenang</td><td><input type="checkbox" name="membaca" value="Membaca"/>Membaca<br/>
                         <input type="checkbox" name="joging" value="Joging"/>Joging<br/>
                         <input type="checkbox" name="gowes" value="Gowes"/>Gowes</td></td>
  </tr>
  <tr>
   <td>DESKRIPSI DIRI</td><td>:</td><td><textarea></textarea></td>
  </tr>
 </form>
 </table>
 <table align="center" border="0">
  <tr>
   <td bgcolor="blue" width="1000" height="50" align="center"><input type="submit"name="oke"value="OKE"/>
   <input type="submit"name="batal"value="BATAL"/></td>
  </tr>
 </table>
 <style>
  input[type=nim]{width: 121%; height: 30px; margin: auto;}
  input[type=nama]{width: 121%; height: 30px; margin: auto;}
  input[type=radio]{cursor: pointer;}
  select {width: 50%; height: 30px; margin: auto; cursor: pointer;}
  input[type=notelp]{width: 121%; height: 30px; margin: auto;}
  input[type=email]{width: 121%; height: 30px; margin: auto;}
  input[type=password]{width: 121%; height: 30px; margin: auto;}
  input[type=checkbox]{margin-right: 10px; cursor: pointer;}
  textarea{width: 121%; height: 100px; margin: auto; max-width: 1000px; max-height: 100px;}
  input[type=submit]{width: 80px; height: 45px; margin-left: 10px; cursor: pointer;}
 </style>
</body>
</html>

Semoga Bermanfaat
Wassalamualaikum Wr.Wb

0 comments:

Post a Comment