The Daily Journal

Tutorial Membuat Form HTML

Tutorial Membuat Form HTML ? Bagaimana cara Membuat Form HTML? Seperti apa Tutorial Membuat Form HTML ?

HyperText Mark Up Language atau disingkat HTML adalah komponen utama untuk membuat website. Dalam pembuatan website yang baik, kita wajib menggunakan HTML untuk kerangka website. HTML memiliki banyak tag dan attribute yang dapat digunakan untuk menyusun kerangka website. Sebelum dihias dan diberi fungsi, sebuah website hanya memiliki HTML. Karena begitu penting, maka HTML adalah hal yang paling wajib kamu pelajari sebelum membuat website.

Baca juga :
Kenapa Teh Hijau Dapat Mengurangi Lemak Tubuh?
Membuat Tabel Menggunakan HTML dan CSS

Pada artikel ini kita akan belajar membuat form di HTML. Apa itu form? Form adalah salah satu tag HTML yang berguna untuk membuat form website. Form biasanya digunakan untuk menginput data pengguna. Hal yang paling sering menggunakan form HTML adalah input data. Tetapi tag <form> juga bisa digunakan untuk radiobutton dan checkbox. Sekarang kita akan fokus menggunakan tag <form> untuk menginput data. Yuk mulai ngodingnya, jangan lupa minum kopi biar gak ngantuk.

Pertama buatlah file HTML dengan nama form.html setelah itu tambahkan kode struktur HTML seperti gambar di bawah ini :

Struktur HTML adalah hal terpenting pada file HTML, tanpa struktur HTML, kode yang dituliskan di file HTML kurang rapi. Struktur HTML diawali dengan <!DOCTYPE html> yang berarti HTML yang seedang dipakai adalah HTML 5. Kemudian dibawahnya ada tag <html> untuk mengawali file HTML. Didalam tag <html></html> terdapat tag <head></head> dan tag <body></body> yang mana tag <head></head> berfungsi untuk menyimpan informasi website dan tag <body></body> yang beisi isi dari website. Setelah memberikan struktur HTML seperti kode di atas, tambahkan kode di bawah ini didalam tag <body></body> :

Kode di atas digunakan untuk membuat form pengisian. Terdiri dari tag <form></form> untuk pembuka dan penanda form, tag <label></label> untuk memberikan informasi pada kotak input, dan tag <input></input> yang digunakan untuk membuat kotak input. Sedangkan tag <button></button> digunakan untuk membuat tombol sumbit.

Sehingga keseluruhan kode menjadi seperti berikut :

Berikut Screenshot keseluruhan kode :

Berikut ini Screenshot hasil form sederhana yang sudah kita buat menggunakan HTML :

Baca juga : Struktur Dasar Penyusun HTML(Tag, Elemen, dan Attribut)

Sekian, terimakasih, dan semoga bermanfaat:)