Etiketli input
<label> ve <input> etiketlerinin nasıl eşleştirildiğini öğrenirsin.
Etiket ve alan eşleşmesi
Bir form alanı genelde iki parçadan oluşur: etiket (<label>) ve giriş alanı (<input>). Etiket, alanın ne istediğini söyler; giriş alanı ise kullanıcının yazacağı yerdir.
İkisini bağlamak için <label>'ün for özniteliğiyle <input>'un id özniteliğini aynı değere eşitlersin. Örnek: <label for="eposta">E-posta</label><input id="eposta">. Böylece etikete tıklamak da alanı odaklar.
id ve for eşleşmesi
id özniteliği bir öğeye sayfa içinde benzersiz bir ad verir. Bir formda her <input>'un kendine özgü bir id'si olmalıdır. <label>'ün for özniteliği de aynı adı taşır.
Örnek: <label for="ad">Adınız</label> ve <input id="ad" name="ad">. Burada for ve id aynı değere (ad) sahiptir; böylece ikisi bağlanır. name ise sunucuya giderken kullanılacak anahtardır.
Uygulama Etiketli input yaz
Form içine bir <label> ve bir <input> ekle. Etiketin metni İsminiz olsun. for ve id özniteliklerini isim değerine eşitle.
Örnek çözümü göster
<form>
<label for="isim">İsminiz</label>
<input id="isim" name="isim">
</form>Kendini test et
-
Bir <label> etiketini <input> ile bağlamak için hangi öznitelik kullanılır?
- for
- name
- value
- type
Cevabı göster
for — Doğru. label'in for özniteliği, input'un id'sine eşitlenince eşleşirler.
-
Etiketin açılışını yaz
<____ for="eposta">E-posta</label> <input id="eposta">Cevabı göster
<label for="eposta">E-posta</label> <input id="eposta"> -
Etiketi rolüyle eşleştir
- for
- label'i input'a bağlar
- id
- input'un benzersiz adı
- <label>
- Alan etiketi
- <input>
- Tek satırlı alan