LABEL UNTUK FORM HTML

Seperti yang kamu lihat di halaman sebelumnya, tag input hanya menampilkan form isiannya tanpa ada tulisan yang jelas.

Untuk membantu pengguna situs mengerti apa yang harus diisi kita bisa menggunakan tag <label>.

Contoh tag label

Berikut contoh kode tag label

<label> Username: </label> <br>
<input type="text">

Hasilnya

Sekarang kotaknya tidak berdiri sendiri! tapi sudah ada text penandanya.

Atribut for pada label

Untuk menghubungkan sebuah label dengan input, kita bisa menggunakan atribut for pada label dan atribut id pada input.

Contoh penggunaan

<label for="username"> Username: </label> <br>
<input id="username" type="text">

Hasilnya

Sekarang coba klik text “Username:” , secara otomatis input akan terpilih agar kamu bisa mulai mengetik tanpa perlu klik kotaknya terlebih dahulu.

Gabungkan dengan tag lain

Di sebuah form, kamu tidak dibatasi dengan tag input atau text saja, kita bisa menggabungkan dengan tag lain yang sudah kita pelajari.

See the Pen by Sekolah Koding (@sekolahkoding) on CodePen.

Di atas, kita memasukkan tag <p> di dalam tag <form> untuk membantu user menjelaskan form sebelumnya.