Deskripsi
Penjelasan HTML label

HTML <label> element merepresentasikan sebuah judul atau penamaan untuk item control (<input>, <select> dan lainnya) yang biasanya berkaitan dengan sebuah form.

<label> element dapat diasosiasikan dengan control tertentu dalam sebuah form dengan menggunakan dua cara. Pertama, dengan menggunakan for attribute, adapun value dari attribute tersebut adalah nama id dari control yang ingin dituju (lihat Contoh 1). Kedua, dengan menempatkan control didalam <label> element (lihat Contoh 2).

  Tips!

Sebaiknya jangan menuliskan link (<a> element) didalam <label> element. Tetapi, untuk kepentingan aksesibilitas, sebaiknya ditulis diluar (bukan sebagai anak element) dari <label> (lihat Contoh 3).

Attributes
Atribut HTML Tag <label>

for

Menentukkan id dari form control (element yang berkaitan dengan sebuah form) yang hendak diasosiasikan.

form

Menentukkan id dari sebuah form, yang mana label tersebut hendak diasosiasikan. Attribute ini berguna jika ingin meletakan label element ditempat lain (bukan didalam <form> element.)


Global Attributes
Atribut Secara Global (Keseluruhan)

<label> tag mencakup global attributes, yang artinya tag tersebut dapat disisipkan semua attributes yang termasuk dalam global attributes yang secara umum berlaku untuk semua HTML tags.

Event Attributes
Atribut event (Peristiwa)

<label> tag mencakup event attributes, yang artinya attribute tersebut dijalankan ketika ada interaksi dari user atau dalam suatu peristiwa (kejadian). Contoh: menjalankan script (JavaScript) ketika halaman web pada jendela browser hendak ditutup, dan lain sebagainya.

Example
Contoh HTML <label> element

Contoh 1

Contoh label dengan attribute for, yang berarti label tersebut untuk control yang memiliki id name

<p>Siapakah Nama Anda?</p>
<label for="name">Nama: </label>
<input type="text" id="name">

Contoh 2

Contoh control (<input> element) yang diapit (terletak) didalam element <label>

<p>Siapakah Nama Anda?</p>
<label>Nama: <input type="text"></label>

Contoh 3

Sebuah link (<a>) sebaiknya ditulis terpisah (diluar) element <label>

<label><input type=checkbox name=tac>Saya Setuju dengan Perjanjian dan Kondisi</label>
(baca <a href="tac.html">Perjanjian dan Kondisi</a>)

Contoh Lengkap
Demo dengan Source Code Editor

Demo Editor
Demo HTML <label>
Code Editor