CSS kullanarak görüntüleri yerine ben oluşturmak için üç farklı resim yerine mermi kullanmak istiyorum

Question

mermi Örnek bir lisli> t

: Yukarıdaki ifadelerin her önce Bunun yerine mermi

<ul> 
    <li>The dog is big</li> 
    <li>The dog is small</li> 
    <li>The dog is medium sized</li> 
</ul> 

yaşanmayacağını Her önce farklı bir görüntü olun.

Answer 1

Liste stili resmi kullanın: url (imagename); mermi tamamen görüntülerle değiştirmek için Bu yöntemin olumsuz tarafı, her tarayıcı, görüntüleri farklı şekilde konumlandırmasıdır. Liste mermileri için CSS arka plan görüntüleri daha tutarlı bir yöntemdir.

http://css.maxdesign.com.au/listamatic/vertical04.htm

Answer 2

sizi liste tarzı imajını özelliğini kullanabilirsiniz.

ul.dogbig 
{ 
    list-style-image:url("/images/dogbig.gif"); 
} 

Answer 3

Orada CSS böyle bir özelliktir ama ben her farklı <li> element için çalışmıyor düşünüyorum: size

Answer 4

Live Demo

yardımcı olacağını

ul 
{ 
list-style-image:url("/images/blueball.gif"); 
list-style-type:square; 
} 

umarım

Bu, CSS özelliğinin list-style-image kullanımını sağlar.

HTML:

<ul> 
    <li class="b1">The dog is big</li> 
    <li class="b2">The dog is small</li> 
    <li class="b3">The dog is medium sized</li> 
</ul> 

CSS:

ul { 
    margin: 0 0 0 32px; 
    line-height: 1.5 
} 
.b1 { 
    list-style-image: url(http://upload.wikimedia.org/wikipedia/commons/1/19/Icons-mini-icon_attachment.gif); 
} 
.b2 { 
    list-style-image: url(http://upload.wikimedia.org/wikipedia/commons/6/61/Icons-mini-icon_security.gif); 
} 
.b3 { 
    list-style-image: url(http://upload.wikimedia.org/wikipedia/commons/a/ab/Icons-mini-icon_clock.gif); 
}