Sunday, March 1, 2015

Tutorial Membuat Form Pendaftaran dengan HTML

Tutorial Membuat Form Pendaftaran dengan HTML 


Selamat pagi sobat kreatif...
Di pagi hari yang cerah ini saya akan membagikanTutorial Membuat Form Pendaftarn dengan HTML yang sudah saya modifikasi dari tutorial sebelumnya yaitu Membuat Form Pendaftaran menggunakan HTML . untuk melihat yang sebelumnya bisa cek disini.. 
belajar itu memang gampang gampang susah, jika tidak gampang ya susah hee.. piss mas Bro,,, :v

Penasaran ?? langsung aja ke TKP..

Tutoralnya..
Seperti bisa siapkan dulu secangkir kopi Notepad++ dan Mozilla firefox atau Google Chrome,.
jika males untuk mengetik ada dua langkah jitu yaitu Copy dan Paste, ya mau gimana lagi jika malass, jika tidak mengerti resiko di tanggung penumpang.

Oke lanjut ke topik
Pertama buka Notepad++ kemudian simpan dengan nama form-pendaftaran.html (jangan salah ya gunakan format tipy HTML)
ketikkan kode berikut


<!DOCTYPE HTML>
<html>
    <head> 

       <title>Form Pendaftaran</title>
    </head>
   
    <body>  

    </body>
</html>


Keterangan :
<!DOCTYPE HTML>    : Sebagai identitas HTML5
<html> </html>               : Baris paling atas dari setiap file HTML dan sebagai tanda awal pembuatan dokumen
<head> </head>              : Informasi umum dari sebuah halaman web
<title> </title>                 : Judul halaman. Terdapat pada head
<body> </body>             : settingan atribut untuk seluruh dokumen

Membuat Judul

ketikaan kede berikut dan letakkan pada area <body> ... </body>

     <h1> Form Pendaftaran </h1>

Keterangan :
<h1>.. </h1>    : tujuannya untuk membuat header atau judul postingan (Heading 1)

jika terlalu besar bisa mengaubah dengan pilihan :
<h1> Form Pendaftaran </h1>
<h2> Form Pendaftaran </h2>
<h3> Form Pendaftaran </h3>
<h4> Form Pendaftaran </h4>
<h5> Form Pendaftaran </h5>
<h6> Form Pendaftaran </h6>   

Contoh hasilnya :

Form Pendaftaran

Form Pendaftaran

Form Pendaftaran

Form Pendaftaran

Form Pendaftaran
Form Pendaftaran

Membuat Tampilan Form


     










































Nama :
Alamat :
Tempat Lahir :
Tanggal Lahir :
Alamat Web :
E-Mail :
No. HP :



Hasilnya .. 

 
Nama :
Alamat :
Tempat Lahir :
Tanggal Lahir :
Alamat Web :
E-Mail :
No. HP :

Keterangan :
 <table> .... </table> merupakan perintah utama dalam pembuatan tabel, 
<tr> ... </tr> tag untuk membuat baris
<td> ... </td> tag untuk membuat kolom/cell
colspan merge/melebarkan kolom/cell
rowspan merge/melebarkan baris

Membuat ComboBox 
Modifikasi pada kode Tanggal lahir

                <td colspan="2">
                      <select name="hari">            
                                    <option value=1>01
                                    <option value=2>02
                                    <option value=3>03
                        </select>  
                        <select name="bln">                             
                                    <option value=1>Januari
                                    <option value=2>Februari
                                    <option valie=3>Maret
                        </select> 
                          <select name="tahun">    
                                    <option value=1991>1991
                                    <option value=1992>1992
                                    <option value=1993>1993
                        </select>
                </td>
            </tr>


Keterangan :
<select> . . . </select> : membuat menu dropdown
value : variabel



 Membuat Radio Button
 Radio digunakan untuk mentukan pilihan berdasarkan check. tambahkan kode berikut diabahnya Tanggal Lahir
             <tr>
                <td>Jenis Kelamin </td>
                 <td> : </td>
                 <td>  </td>
                <td><input type = "radio" name = "gendor"  value ="Male" />Male</td> 

            </tr>
            <tr>
                <td> </td>
                 <td> : </td>
                 <td>  </td>
                <td><input type = "radio" name = "gendor"  value ="Female" />Female</td> 

            </tr>

Contoh hasilnya ..


Tanggal Lahir :
Jenis Kelamin :
Male

:
Female


Membuat Menu Submit dan Reset
tambahkan kode berikut diatasnya </table>

            <tr>
                <td></td>
                 <td></td>
                 <td></td>
                <td ><input type = "Submit" value="Submit" >

                <input type = "reset" value="Reset"></td>
            </tr>




dan inilah hasilnya...


Menambahkan Gambar
cari kode <form> dan letakkan kode berikut tepat di bawahnya..

       <table align="right">
            <tr>
                <td>  <img alt="Rhaomlie" height="300" src="rhaomlie.jpg" width="200" />
            </tr>
            <tr>
            <td align="center"><b>Mohammad Ramli</b></td>
            </tr>
            <tr>
            <td align="center"><i>1310651201</i></td>
            </tr>
            <tr>
            <td align="center"><u>http://Rhaomlie.Blogspot.com</u></td>
            </tr>
    </table>

Keterangan :
kode untuk menambahkan gambar hanyalah kode ini :
<img alt="Rhaomlie" height="300" src="rhaomlie.jpg" width="200" />

warna hijau = nama gambar
height = tinggi gambar
widht = lebar gambar


Modifikasi Background
Mengubah warna bacground :
cari kode <body> ubah kode seperti berikut, tambahkan kode bgcolor="#99FF00" pada <body>.
contohnya : <body bgcolor="#99FF00"> 

Menyisipkan gambar Backgroud
Siapkan gambar backgroud terlebih dahulu misal nama gambar green.jpg
maka tambahkan kode background="green.jpg" setelah kode diatas.
hasilnya seperti ini :
<body bgcolor="#99FF00" background="green.jpg">

Finishh......



Hasil Ahir, kili gambar untuk memperbesar.



untuk mendownload kode full, silahkan klik tautan di bawah ini...

>>>>>>DOWNLOAD<<<<<<




Sekian tutorial dari saya, apabila sobat ingin mengcopas artikel ini jangan lupa untuk menyertakan refrensinya..


refrensi : http://rhaomlie.blogspot.com/2015/03/tutorial-membuat-form-pendaftaran-dengan-HTML.html




17 comments:
Write komentar
  1. izin download ya, buat referensi belajar. trimakasih...

    ReplyDelete
    Replies
    1. Tutorial Membuat Form Pendaftaran Dengan Html - Ksatria Pengelana >>>>> Download Now

      >>>>> Download Full

      Tutorial Membuat Form Pendaftaran Dengan Html - Ksatria Pengelana >>>>> Download LINK

      >>>>> Download Now

      Tutorial Membuat Form Pendaftaran Dengan Html - Ksatria Pengelana >>>>> Download Full

      >>>>> Download LINK 7Y

      Delete
  2. Itu di klik reset bisa atau tidak

    ReplyDelete
  3. alhamdulillah, akhirnya saya menemukan artikel yang saya cari yaitu tentang membuat form di HTML. Artikel ini memuat langkah-langkah yang sederhana dan jelas untuk dipahami. Semoga kakak dapat memberikan artikel-artikel yang berguna bagi orang banyak. Terima kasih ya kak... terus berkarya, ditunggu artikel update-an selanjutnya. Perkenalkan nama saya Meilianda Aryanti Abelia, kunjungi website kampus saya https://www.atmaluhur.ac.id/

    ReplyDelete
  4. Weees. Terimakasih ya kakak atas artikel nya. Tentang cara membuat Form Pendaftaran dengan HTML. Disertai dengan langkah - langkah yang mudah dimengerti.Terimakasih ya kakak atas informasinya. Perkenalkan nama saya Jheny sandella.
    Website kampus saya : https://www.atmaluhur.ac.id/

    ReplyDelete
  5. Yeayyy, finally I found the article that I was looking for which is about creating forms in HTML. This article contains steps that are simple and clear to understand. Hopefully you can provide articles that are useful for many people. Thank you sis, keep on working and always successful ..., introduce my name, Eva Maulani, visit my campus website https://www.atmaluhur.ac.id/

    ReplyDelete
  6. Mantab kak artikel nya sangat membantu kami bagaimana cara membuat html nya. Artikelnya disertai langkah langkah yang mudah dimengerti sederhana dan mudah untuk di pahami. Terima kasih ya kakkk. . Semoga makin aktif terus kak dan semoga sukses kedepannya. Perkenalkan nama saya Derma Anzeny, website kampus saya:
    https://www.atmaluhur.ac.id/

    ReplyDelete
  7. Terimakasih kak atas artikel yang kakak buat,Tentang tutorial membuat form pendaftaran dengan HTML.Penjelasan dan langkah-langkahnya mudah dipahami dan dimengerti.
    Ditunggu artikel-artikel kakak selanjutnya...
    Sukses teruss dan terus berkarya yaaa kak.Perkenalkan Nama saya adeka sri purwanti.kunjungi website kampus kami https://www.atmaluhur.ac.id

    ReplyDelete
  8. Wahh attikelnya kren banget kak,,ini sangat membantu saya dalam cara membuat from pendaftaran dengan HTML..
    Terima kasih kak..
    Penjelasaan dalam artikel yang kakak buat mudah sekali dipahami dan saya alhamdulilah sudah paham
    Sukses selalu kak,saya tunggu artikel selanjutnya
    Perkenalkan nama saya Sawalia Safitri kunjungi website kampus kami https://www.atmaluhur.ac.id.

    ReplyDelete
  9. Alhamdulillah artikel yang saya cari akhirnya ketemu juga. Sangat membantu saya dalam belajar memahami Tutorial Membuat Form Pendaftaran dengan HTML. Sangat jelas dan mudah di pahami. Terimakasih kak semoga senantiasa berbagai ilmu selanjutnya. Nama saya pauziah kunjungi website kampus kami https://www.atmaluhur.ac.id

    ReplyDelete
  10. ohhhhh I see how it turned out after I looked around and finally found an article on how to add the form in html. easy to understand and very simple especially for me who is a beginner. thank you very much brother for knowledge hopefully more useful for many people. and keep up the spirits in writing the article. introduce my name is Ulfa Maryanti, our campus website https://www.atmaluhur.ac.id/

    ReplyDelete
  11. Hai kak terimakasih untuk artikelnya.karena ini saya dapat mengetahui bagaimana cara membuat Form pendaftran dengan hmtlnya.sukses selalu ya..
    perkenalkan nama saya Lailatul marfu'ah
    kunjungi website kampus kami https://www.atmaluhur.ac.id/

    ReplyDelete
  12. Wahh artikelnya sangat bermanfaat untuk saya,sebab sebelumnya saya belum mengetahui bagaimana cara membuat from pendaftaran dengan html, terimakasih kak akhirnya setelah saya membaca artikel dari kakak saya jadi tahu bagaimana membuat from pendaftaran dengan html, sukses selalu dalam berkarya.perkenalkan nama saya Wendi sepriyadi
    Website kampus saya
    https://www.atmaluhur.ac.id/

    ReplyDelete
  13. Hi Min..artikenya keren membantu sekali bagi saya sipemula yg baru belajar tentang form pendaftaran HTML, semoga sehat & sukses selalu ya Min ditunggu artikel selanjut nya salam kenal nama saya Margiana Rahayu
    Kunjungi website kampus saya
    https://www.atmaluhur.ac.id/

    ReplyDelete
  14. Hai kak terimaksih untuk artikelnya,sangat berguna bagi saya yang masih pemula yang batu belajar tentang from pendaftaran HTML.semoga sukses selalu dalam bekarya salam kenal nama saya fauzan
    Kunjungi website kampus saya
    https://www.atmaluhur.ac.id/

    ReplyDelete
  15. You need personal informations from companies,family and friends that will better your life and you need easy access without them noticing just contact nick or you’re financially unstable or you have a bad credit score, he will solve that without stress,he and his team can clear criminal records without leaving a trace and can also anonymously credit your empty credit cards with funds you need,all these are not done free obviously but I like working with nick and his team cause they keep you updated on every step taken in order to achieve the goal and they also deliver on time,I tested and confirmed this I’m still happy on how my life is improving after my encounter with him ,you can send a mail to vladislav.nickhack@outlook.com
    Text/call +17078685071

    ReplyDelete
  16. Tutorial Membuat Form Pendaftaran Dengan Html - Ksatria Pengelana >>>>> Download Now

    >>>>> Download Full

    Tutorial Membuat Form Pendaftaran Dengan Html - Ksatria Pengelana >>>>> Download LINK

    >>>>> Download Now

    Tutorial Membuat Form Pendaftaran Dengan Html - Ksatria Pengelana >>>>> Download Full

    >>>>> Download LINK

    ReplyDelete

Terimakasih Atas Kunjungan Anda..
Kritik dan Saran Anda membantu blog ini lebih baik..