tRikSonic
Tema

HTML label Tag

Terakhir diperbarui : 23 Mei 2018 - 16.39

Tutorial HTML <label>:

HTML label Tag - belajar html label, element label mempunyai fungsi sebagai label atau identitas pada element yang terkait dengan form field, contoh nya : <form>, <input> dan lain sebagainya.
background html

Contoh HTML <label>

<label>
  <input type="text"/>
</label>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<label>
  <input type="text"/>
</label>

</body>
</html>

Attribute HTML <label>

for
Mengikat penggunakan label berdasarkan ID tertentu
Contoh :
<form>
  <label for="nama-lengkap">Nama Lengkap :</label>
  <input type="text" id="nama-lengkap"/>
  <br>
  <label for="alamat-lengkap">Alamat Lengkap :</label>
  <input type="text" id="alamat-lengkap"/>  
</form>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<form>
  <label for="nama-lengkap">Nama Lengkap :</label>
  <input type="text" id="nama-lengkap"/>
  <br>
  <label for="alamat-lengkap">Alamat Lengkap :</label>
  <input type="text" id="alamat-lengkap"/>  
</form>

</body>
</html>
form
Mengikat penggunakan label berdasarkan ID form tertentu
Contoh :
<label for="biodata" form="biodata">Biodata</label>  
<form id="biodata">
  Nama : <input type="text"/> <br> 
  Pendidikan : <input type="text"/>
</form>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>Demo Triksonic</title>
</head>
<body>

<label for="biodata" form="biodata">Biodata</label>  
<form id="biodata">
  Nama : <input type="text"/> <br> 
  Pendidikan : <input type="text"/>
</form>

</body>
</html>

Global Attributes:

Element <label> mencakup Global Attributes HTML.

Event Attributes:

Element <label> mencakup Event Attributes HTML.

Browser Support :

Desktop

ChromeYa
SafariYa
FirefoxYa
OperaYa
IEYa
EdgeYa

Mobile

Android WebviewYa
Chrome AndroidYa
Edge MobileYa
Firefox AndroidYa
Opera AndroidYa
iOs SafariYa
Samsung InternetYa

Default CSS :

Browser yang support dengan element <label>, biasanya mempunyai nilai default :
label {
    cursor: default;
}
X
Run
Klik tombol Run, untuk menampilkan hasil editing, atau menyegarkan editor.