DescriptionList

Ne zaman kullanılır

DescriptionList, tek bir kaydın alanlarını terim ve değer olarak gösterir: bir kaydın ayrıntı paneli, bir ayar özeti, bir yan panel. Terimler kısa, değerler okunacak bilgidir.

Ne zaman kullanılmaz

• Çok kaydı karşılaştırmak için: Satır ve sütunları karşılaştırılacak veri için Table ya da DataTable kullanın.
• Sayısal özet için: Değer, değişim ve eğilim için StatCard kullanın.
• Düzenlenebilir alanlar için: Form alanları için Field ve ilgili denetimleri kullanın.
• Sıralı ya da madde işaretli liste için: Terimi olmayan öğeler için düz liste kullanın.

Anatomi

1. Kök (DescriptionList): yerel <dl>; yerleşimi, boyutu ve ayırıcıları belirler.
2. Satır (DescriptionList.Item): terimi, değeri ve işlemi saran <div>; <dl> içinde geçerli bir gruptur.
3. Terim (DescriptionList.Term): <dt>; ikincil renkte, orta kalınlıkta.
4. Değer (DescriptionList.Details): <dd>; varsayılan renkte. Boşsa çizgi ve gizli gerekçe.
5. İşlem (DescriptionList.Action): satır sonunda ayrı bir <dd>; isteğe bağlı.

Davranış

• DescriptionList durağandır: giriş hareketi yoktur, sekme sırasına girmez. Yalnızca içindeki işlemler sekme durağıdır.
• inline yerleşim 1024 px’in altında alt alta, 1024 px’ten itibaren yan yana durur. Terim sütunu bütün satırlarda aynı genişliktedir (satır genişliğinin üçte biri).
• Uzun değer satır kırar; terim ve değer yan yana dururken değer taşmaz.
• Boş değer — olarak görünür; satır silinmez.

Yönergeler

Terimi kısa, değeri açık yazın

Terim değerin ne olduğunu söyler; değer bilgidir.

Durum

Etkin

Oluşturulma tarihi

28 Ekim 2026

YapınKısa terim, açık değer.

Bu öğenin şu anki durumu nedir

Etkin

YapmayınTerim cümle gibi uzun; değerle karışıyor.

Boş değeri gizlemeyin

Bilgi yoksa satırı silmeyin; çizgi gösterin. Satırlar her kayıtta aynı yerde kalır.

Ad

Birinci öğe

Açıklama

—bilgi yok

YapınDeğer yok: çizgi ve gizli gerekçe.

Ad

Birinci öğe

YapmayınBoş satır silinmiş; kayıtlar arasında satırlar kayıyor.

Durumu metinle gösterin

Değer olarak bir Badge koyabilirsiniz; durum metinle okunur.

Durum

Etkin

YapınDurum Badge'de, metinle.

Durum

YapmayınDurumu yalnızca renkli bir nokta anlatıyor.

İçerik

• Terimi isim öbeği olarak, cümle düzeninde yazın: “Oluşturulma tarihi”, “Kimlik”.
• Terime iki nokta koymayın; yerleşim ayrımı yapar.
• Değeri uygulamanız Intl ile biçimlendirsin.
• İşlemin adı bir fiil olsun ve neyi etkilediğini söylesin: “Kimliği kopyala”.

İlgili bileşenler

• StatCard: Sayısal özetler için.
• Card: DescriptionList’i bir yüzeyde gruplamak için.
• Badge: Durum değerleri için.
• Button: Satır sonu işlemleri için.