Membuat Form Dengan HTML CSS

Formulir Sederhana HTML CSS

Kali ini saya akan menjelaskan tutorial cara membuat formulir atau yang biasa disebut form. Setelah sebelumnya memberikan langkah-langkah mudah cara membuat table, kali ini adalah cara membuat form. Untuk membuat form memerlukan element form pada HTML. Kemudian didalamnya dimasukkan input data dengan diawali tulisan “input“. Didalam “input” terdapat beberapa atribut seperti type, name, value, placeholder bahkan Anda dapat menambahkan required diakhirnya.

Saya akan memasukkan placeholder dengan tulisan, maka tulisan tersebut akan muncul pada kolom form tapi akan hilang ketika seseorang mulai menulis sesuatu pada kolom tersebut. Ada juga “type“, disitu kita isi dengan jenis pada kolom tersebut. Miisalnya jenis dari kolom yang akan digunakan adalah untuk mengisi nama maka “type” nya cukup diisi dengan “text“, kalo kolom tersebut untuk mengisi email maka kita bisa isi “type” tersebut dengan “email

Type dapat diisi dengan jenis atau tipe input yang Anda inginkan, contoh Anda membuat kolom email maka type tersebut diisi dengan “email“. Kenapa? Karena jika diisi type email untuk kolom email, maka email yang tidak valid alias tulisan yang diisi pada kolom tersebut bukan berupa email. Sistem akan menolaknya secara otomatis. Seperti apa email yang seharusnya? Terdapat @ dan .com atau ekstensi lainnya. Seperti pada gambar ini: (lihat gambar)

Pada gambar diatas, akan muncul info dalam bahasa inggris (default html) yang menyebutkan bahwa tulisan yang kita masukkan pada kolom email terdeteksi sebagai bukan email yang valid. Itulah fungsinya kenapa kita isi “type” email. Kemudian “name” dan “value” diisi jika dihubungkan dengan PHP, maka ketika Anda mengisi ini harus memahami cara pakai PHP terlebih dahulu.

Masih bingung ? Lihat: Video tutorial membuat form HTML CSS . Lebih banyak penjelasan dan contoh lainnya.

Required adalah wajib, maka ketika kolom yang ditandai dengan required tidak dapat dilewati oleh para pengunjung alias harus diisi agar formulir dapat di submit atau dikirim. Akan muncul pemberitahuan bahawa kolom yang required tidak bisa dibiarkan kosong alias harus diisi agar form bisa terkirim.

Selamat mencoba !

SUBSCRIBE
Subsribe sekarang dan dapatkan UPDATE terbaru melalui Email.
Berhenti Subscribe Kapanpun!
POS Lainnya:

1
Tinggalkan Komentar

avatar
clash royale
Visitor
clash royale

Wow, this post is fastidious, my sister is analyzing these kinds of things, so I am going to
convey her.

Situs ini menggunakan Cookie untuk meningkatkan pengalaman setiap pengunjung SETUJU & TUTUP Lihat Privasi