Liste stili türü
list-style-type ile madde işaretlerini değiştirirsin.
Madde işaretini değiştir
HTML'de ul ve ol etiketleri liste oluşturur. Varsayılan olarak ul içi dolu daire (disc), ol ise arap rakamları (decimal) gösterir. CSS'in list-style-type özelliği bu madde işaretlerini değiştirir.
Örneğin ul için square yazarak kare işaret, ol için lower-roman yazarak roma rakamları elde edebilirsin. Böylece listenin biçimi içeriğine uygun hale gelir.
Yaygın değerler
Madde işaretli listeler için sık değerler: disc (dolu daire), circle (içi boş daire), square (kare). Numaralı listeler için: decimal (1, 2, 3), lower-alpha (a, b, c), lower-roman (i, ii, iii), upper-roman (I, II, III).
Bir değer seçtiğinde tarayıcı her ögenin önüne o işareti koyar. Aynı liste içinde işaret biçimi tek tiptir; karışık kullanım için her ögeye ayrı sınıf vermek gerekir.
Uygulama Numaralı listeyi roma rakamına çevir
Bir ol tür seçicisi yaz ve list-style-type: lower-roman tanımla. Böylece numaralı liste küçük harfli roma rakamlarıyla görünecek.
Örnek çözümü göster
/* numaralı liste işaretini değiştir */
ol {
list-style-type: lower-roman;
}Kendini test et
-
list-style-type: lower-roman ne üretir?
ol { list-style-type: lower-roman; }- i, ii, iii, iv
- 1, 2, 3, 4
- a, b, c, d
- •, •, •, •
Cevabı göster
i, ii, iii, iv — Doğru. lower-roman küçük harfli roma rakamları verir: i, ii, iii.
-
Kare madde işareti tanımla
ul { ____; }Cevabı göster
ul { list-style-type: square; } -
Değeri anlamına eşle
- disc
- İçi dolu daire
- circle
- İçi boş daire
- square
- Kare işaret
- decimal
- 1, 2, 3, 4