Form · Fieldset

Alan grubu

Birbirine bağlı form alanlarını tek bir soru altında toplar.

CSS: kararlı
JavaScript: gerekmiyor
React: kararlı
Vue: kararlı

Örnekler

Temel Canlı örnek

Doğum tarihiniz nedir?

Örnek: 27 03 1997

HTML kodunu göster

<fieldset class="kiris-alan-grubu">
  <legend class="kiris-baslik-legend kiris-baslik-legend--buyuk">Doğum tarihiniz nedir?</legend>
  <p class="kiris-yardim">Örnek: 27 03 1997</p>
</fieldset>

Ne zaman kullanılır

Onay kutusu veya seçenek düğmesi grubunda her zaman kullanın.
Tarih gibi çok parçalı bir girişte kullanın.

Erişilebilirlik

legend sorunun kendisidir. Ekran okuyucu her alanla birlikte okur.
Sayfada tek soru varsa legend sayfa başlığı ile aynı olur.

Karşılanan WCAG 2.2 ölçütleri 1.3.1 3.3.2

Kaynak

Benzer bir bileşen şu ülkelerin tasarım sistemlerinde de var: UK, DE, NO.

Bu bileşenin kodu depoda:

Kayıt defteri tanımı, adı, özeti, kullanım kuralı ve örnekleri
CSS katmanları, kiris-fieldset ile başlayan sınıflar