Yerleşim · Divider

Ayraç

İki içerik bölümünü ince bir çizgiyle ayırır.

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

Örnekler

İki kalınlık Canlı örnek

Birinci bölüm.

İkinci bölüm.

Üçüncü bölüm.

HTML kodunu göster

<p class="kiris-govde">Birinci bölüm.</p>
<hr class="kiris-ayrac">
<p class="kiris-govde">İkinci bölüm.</p>
<hr class="kiris-ayrac kiris-ayrac--kalin">
<p class="kiris-govde">Üçüncü bölüm.</p>

Ne zaman kullanılır

Başlık aralığı yeterli olmadığında kullanın.
Her paragraf arasına koymayın. Boşluk yeterlidir.

Erişilebilirlik

Anlamsal ayrım için <hr> kullanılır. Süs için role="presentation" eklenir.

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

Kaynak

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

Bu bileşenin kodu depoda:

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