Cara Membuat Form Pendaftaran Menggunakan HTML

shares

HTML singkatan dari Hyper Text Markup Language. Yaitu dasar membuat Website. Sebelum mulai belajar Web Programming, kalian diharuskan atau menguasai dasar-dasar HTML terlebih dahulu. 

Okeey, sekarang saya akan membahas tentang cara membuat form pendaftaran sederhana menggunakan html. disini saya akan menggunakan NOTEPAD.


1. Pertama anda membuka Notepad dengan cara klik "START" lalu "ALL PROGRAMS" pilih folder "ACCESSORIES" dan pilih "NOTEPAD".
2. Lalu mari kita mencoba belajar membuat form Pendaftaran tersebut.




Ini Bahasa Pemogramannya yang saya ( Sumber : heruprasetyo-26.blogspot.com ) telah buat. kalau kalian males ngetik boleh langsung copas aja hehe. tapi menurut saya lebih baik ngetik ulang agar kalian mengerti dan paham.


<html>
<head>
<title>Pendaftaran</title>
</head>

<body>
<h1>FORMULIR PENDAFTARAN</h1>

<table border="0" style="center; color:#FF0000">

<tr>
    <td>Nama Lengkap</td>
    <td>:</td>
    <td><input type="text"></td>
</tr>

<tr>
    <td>Tempat Lahir</td>
    <td>:</td>
    <td><input type="text"></td>
</tr>

<tr>
    <td>Tanggal Lahir</td>
    <td>:</td>
    <td><input type="Date"></td>
</tr>

<tr>
    <td>Jenis Kelamin</td>
    <td>:</td>
    <td><input type="radio"/>Laki-Laki
   <input type="radio"/>Perempuan</td>
</tr>

<tr>
    <td>Alamat</td>
    <td>:</td>
    <td><textarea cols="22" rows="3" ></textarea></td>
</tr>

<tr>
    <td>E-mail</td>
    <td>:</td>
    <td><input type="email"></td>
</tr>

<tr>
    <td>No Hp</td>
    <td>:</td>
    <td><input type="number"></td>
</tr>

<tr>
    <td>Kota</td>
    <td>:</td>
    <td><select>
      <option>*****SELECT KOTA*****</option>
      <option>Bogor</option>
     <option>Jakarta</option>
      <option>Bekasi</option>
      <option>Tangerang</option>
      <option>Depok</option>
      <option>cikarang</option>
      <option>Banten</option>
      </select></td>
</tr>

<tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td><input type="submit" name="submit" value="simpan"/>
    <input type="reset" name="reset" value="Batal"/></td>
</tr>

</table>
</body>

</html>  

3.  Simpan Notepad dengan mengklik SAVE AS, Simpan dengan nama Formulir.html dan pilih save as Type All Files.

4. Setelah tersimpan lalu anda bisa melihat hasilnya.


5. Anda bisa mengeditnya lagi di Notepad lalu simpan dengan menekan CTRL+S dan Refresh di halaman web dengan menekan F5.



PENJELASAN:

<table> 
Untuk membuat table seperti di MS.Excel, tapi cara membuat tablenya menggunakan bahasa html dan di dalam script table teridiri 3 tag yaitu: th, td dan tr.

<td>
Kepanjangan dari Table Data yang digunakan untuk membuat kolom

<th>
kepanjangan dari Table Heading yang digunakan untuk membuat judul sebuah table seperti No dan Nama, biasanya di tanda dengan huruf menjadi Bold. (tapi saya tidak memakai th, hanya memberi tau maksud dan fungsinya).

<tr>
kepanjangan dari Table Row yang digunakan untuk membuat baris baru.

Border
Border adalah Mengatur ketebalan garis Atau garis tepi pada table. 
*(coba border="0" diganti jadi border="1" dan lihat hasilnya)

&nbsp;
Untuk Spasi.

Hasil

Pendaftaran

FORMULIR PENDAFTARAN

Nama Lengkap :
Tempat Lahir :
Tanggal Lahir :
Jenis Kelamin : Laki-Laki Perempuan
Alamat :
E-mail :
No Hp :
Kota :
   

Related Posts

0 komentar:

Posting Komentar

Cara Membuat Website dan Toko Online WebsitePraktis.com
atau SMS/Telpon/WhatsApp 0857 11171946