Fieldset ve legend
<fieldset> ve <legend> ile form grupları oluşturursun.
Fieldset ile alan gruplama
Uzun formları <div> ile bölümlemek yerine <fieldset> kullanırsın. Bu etiket ilgili alanları bir kutu içine alır; tarayıcı çoğu zaman kenarlık çizer. <fieldset> özellikle erişilebilirlik için değerlidir: ekran okuyucu içindeki denetimleri tek bir grup olarak okur.
Gruba başlık eklemek için <legend> etiketini kullanırsın. Legend, fieldset'in ilk çocuğu olmalı. Adından belli olur: kargoda teslimat adresi, ankette katılımcı bilgileri gibi grupları adlandırır.
Legend yerleşimi ve erişilebilirlik
Legend her zaman fieldset'in ilk çocuğu olarak yazılır; sonraya koymak geçersizdir. Tarayıcı legend'i grup çerçevesinin sol üst köşesine yerleştirir. Ekran okuyucu her alan okunduğunda başlığı tekrar söyleyerek bağlamı korur.
İç içe fieldset de mümkündür: büyük anketlerde ana grupları alt başlıklara bölersin. Ama çok derinleşmek karışıklık yaratır; iki seviye genelde yeter.
Uygulama Teslimat adresi grubunu yaz
Form içine bir <fieldset> ekle. İlk çocuk olarak bir <legend> yaz ve metni Teslimat adresi olsun. Legend'den sonra bir <label> ve bir <input> ekle. Etiketin metni Adresiniz olsun. for ve id özniteliklerini adres değerine eşitle. Son olarak </fieldset> ile kapat.
Örnek çözümü göster
<form>
<fieldset>
<legend>Teslimat adresi</legend>
<label for="adres">Adresiniz</label>
<input id="adres" name="adres">
</fieldset>
</form>Kendini test et
-
Fieldset ve legend ile ilgili hangisi yanlıştır?
- fieldset ilgili alanları bir araya getirir
- legend fieldset'in dışına da yazılabilir
- legend grup başlığı olarak görünür
- legend fieldset'in ilk çocuğu olmalıdır
Cevabı göster
legend fieldset'in dışına da yazılabilir — Doğru. Legend her zaman fieldset'in içinde, ilk çocuk olarak yazılır.
-
Gruba başlık veren etiketi yaz
<fieldset><____>Teslimat adresi</legend></fieldset>Cevabı göster
<fieldset><legend>Teslimat adresi</legend></fieldset> -
Etiketi rolüyle eşleştir
- fieldset
- İlgili alanları gruplar
- legend
- Gruba başlık verir
- input
- Veri alanı çizer
- label
- Alan adını yazar