listStyle özelliği, elementin üç farklı liste biçimi özellikleri olan listStyleImage, listStylePosition ve listStyleType özelliklerinin hepsinin birden belirlenmesini sağlar. UL, OL ve LI elementlerinde kullanılabilen CSS list-style özelliği, ayrıca display özelliği list-item olarak belirtilmiş tüm elementlerde kullanılabilir.
DOM Sözdizimi
element.style.listStyle = "tip konum resim"
CSS Sözdizimi
list-style: tip konum resim
| tip | Liste tipini belirler. Ayrıca bakınız: listStyleType |
| konum | Liste iminin konumunu içeride veya dışarıda olarak belirler. Ayrıca bakınız: listStylePosition |
| resim | Liste imi olarak kullanılacak resmi belirler. Ayrıca bakınız: listStyleImage |
Aşağıdaki örnek, div elementlerinin display özelliklerinin list-item değeri ile liste elemanı olarak tanımlanmasını göstermektedir.
<style type="text/css">
.ornekDiv1, .ornekDiv2 {
display: list-item;
margin-left: 20px;
}
.ornekDiv1 {
list-style: outside circle;
}
.ornekDiv2 {
list-style: inside disc;
}
</style>
<div class="ornekDiv1">Seçim 1</div>
<div class="ornekDiv1">Seçim 2</div>
<div class="ornekDiv2">Seçim 1</div>
<div class="ornekDiv2">Seçim 2</div>
Canlı Sonuç
Seçim 1
Seçim 2
Seçim 1
Seçim 2