每个li的不同列表样式图像 [英] Different list style image for each li
本文介绍了每个li的不同列表样式图像的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有一些ul和li的问题...
我想用3 li创建一个无序列表,每个li都有一个不同的列表样式图像.. 。$
我写了这段代码,但图片没有出现......
I've got a problem with some ul and li...
I'd like to create an unordered list with 3 li and each li has got a different list-style-image...
I wrote this code but the image don't appear...
你能帮帮我吗?谢谢!
Can you help me? Thanks!
编辑:用HTML代码更新帖子;)
Post updated with HTML code ;)
<div id="right_main">
<ul id="mainFeatures">
<li id="wishlist">Some text here...</li>
<li id="sharing">Some text here...</li>
<li id="linking">Some text here...</li>
</ul>
</div>
#right_main ul#mainFeatures {
height:250px;
width:350px;
overflow:hidden;
margin-left:25px;
}
#mainFeatures li {
font-weight:bold;
font-size:22px;
font-family:"Myriad Pro", sans-serif;
padding:5px;
}
#mainFeatures li#wishlist {
list-style-image:url(images/wishListImage.png);
list-style-position:outside;
}
#mainFeatures li#sharing {
list-style-image:url(images/sharingListImage.png);
list-style-position:outside;
}
#mainFeatures li#linking {
list-style-image:url(images/linkingListImage.png);
list-style-position:outside;
}
推荐答案
很可能,您的图片被 overflow:hidden
。我删除了它,它现在有效: http://jsfiddle.net/ahwhj/
Most likely, your images were cut off by overflow: hidden
. I've removed that and it works now: http://jsfiddle.net/ahwhj/
这篇关于每个li的不同列表样式图像的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文