Skip to main content

Membuat Form Register dengan HTML & CSS

Setelah kita belajar membuat form login, sekarang kita belajar membuat form register. Bagi kalian yang belum baca bagaimana cara membuat login form silahkan baca Login Form


Seperti apa register form dan apa fungsinya serta bagaimana cara membuatnya? Mari kita sama - sama siapkan sesajennya terlebih dahulu sebelum otak kita menguras banyak resource dari tubuh kita. 

kurang lebih kita akan melakukan design seperti tampak pada gambar, dimana dari gambar tersebut kita bisa memulai dengan membuka code editor kesayangan kita, bagi yang ingin tahu lebih banyak tentang code editor bisa baca disini code editor lengkap dari A - Z

Dalam hal ini saya akan membuka code editor android saya yaitu acode. Salah satu bentuk kemajuan teknologi yang saya nikmati adalah menggunakan program komputer yang dapat dijalankan di android. Berikut penampakan Acode. 
Bentuknya yang elegant dan ringan ini mebuat saya tertarik untuk menggunakannya meskipun ada beberapa IDE lain. Baiklah kita tidak akan berlama - lama dengan ini semua. Kita akan langsung mulai ngoding, dan membuat Register Form dengan menggunakan HTML, CSS dan BOOTSTRAP. 

Pertama buatlah sebuah form dengan method post yang didalamnya terdapat 3 buah element div memiliki class form-group, class tersebut adalah milik framework bernama bootstrap, jadi dengan bantuan bootatsrap kita tidak perlu puyeng - puyeng membuat kode css, bagi kamu yang suka tantangan boleh kalian ngulik sendiri ya. Setelah 3 element div dibuat, buatlah pada masing - masing div sebuah input dengan class form-control, ini juga sama punya bootstrap, pada input bedakan atribut dari masing - masing input, input pertama type nya harus text, kedua email dan ketiga password, masing - masing input bedakan name dan id nya pastikan aktikan required nya dengan nilai true. Sehingga kalo kalian membuatnya maka harusnya seperti gambar di bawah ini.
Buat kalian yang mau copas kodenya silahkan, tapi saran ane mendingan kalian ketik ulang ya, biar kalian lebih lancar mengetik dan memahami apa yang sedang kalian buat.

Source code
Register Form
<form method="post">
  <div class="form-group">
  </div>
  <div class="form-group">
    <input type="text" name="username" id="username" placeholder="Username" class="form-control" required>
  </div>
  <div class="form-group">
    <input type="email" name="email" id="email" placeholder="Email" class="form-control" required>
  </div>
  <div class="form-group">
    <input type="password" name="ps" id="ps" placeholder="Password" class="form-control" required>
  </div>
  <div class="form-group">
    <input type="submit" name="simpanUser" class="btn btn-primary btn-block">
  </div>
</form>
Labels:

Comments

Post a Comment

Popular posts from this blog

Pelajar dan Internet

Pelajar dan Internet  Pelajar adalah salah satu tolak ukur kemajuan suatu negara dimata dunia, internet adalah salah satu media informasi yang bersifat global, setiap orang dari berbagai penjuru dunia dapat mengaksesnya, seiring kemajuan Ilmu Teknologi maka semua kegiatan yang ada di real world harus disangkut pautkan dengan penggunaan IT, dan sekarang sudah dimulai dengan diperkenalkannya kepada pelajar SMP di Indonesia,
Post a Comment
Read more

Guru dan Internet

Guru dan Internet  Tahukah anda tentang seorang guru? dan tahukah anda hubungan guru dengan internet ? ya jika belum tahu saya juga belum tahu :D, maka dari itu coba kita telusuri apasih hubungannya guru dan internet . Tapi dalam hal ini saya tidak akan menjelaskan siapa guru dan siapa internet namun hanya sebagian kecil penyambung lidah persamaan atau perbedaan antara guru dan Internet , yang akan saya bahas adalah bagaimana cara belajar yang baik, baik itu dengan guru atau dengan internet , jadi tidak ada halangan bagi seorang pelajar atau karyawan yang memang sudah tidak punya guru karena keterbatasan waktu, apabila anda orang yang termasuk dalam kategori orang yang sudah tidak punya guru karena keterbatasan waktu, mungkin artikel ini cocok untuk anda.  Internet
3 comments
Read more

Telpon Gratis via Internet

Telephone berjam-jam tanpa PULSA? Internet selain tempat mencari dan menambah informasi ternyata Internet juga merupakan tempat komunikasi sebagaimana tujuan internet pada awalnya adalah dibentuk untuk membantu berkomunikasi antara Militer Amerika karena pada waktu itu perang dunia ke II sedang berlangsung.  Telephone Gratis?
Post a Comment
Read more