更改单个列表项目项目符号的正确方法

slo*_*ife 3 html css standards

我有这样的css:

.done {list-style-image:url('images/tick.gif')}
.notdone {list-style-image:url('images/cross.gif')}
Run Code Online (Sandbox Code Playgroud)

和html这样:

<ul>
    <li class="done">Done</li>
    <li class="notdone">Not Done</li>
</ul>
Run Code Online (Sandbox Code Playgroud)

适用于IE6和FF.每个li项目都有一个不同的子弹图像.但是我在list-style-image上看到的所有文档都说它应该应用于ul标签.

是否有适当的或基于标准的方式来做我想做的事情,或者是这样吗?

编辑:http://www.w3.org/TR/CSS21/generate.html

看起来它并没有说我不能在li标签上使用list-style-image,但是这些例子没有显示出来.

TSt*_*per 6

我相信你指的文档就是你希望子弹遵循某种格式,这就是为什么这个类应用于父标签的原因

<ul> 
Run Code Online (Sandbox Code Playgroud)

在那些情况下.由于你有两张图片,每张图片都有你自己的子弹,我看到你正在做的事情没有错


Zac*_*man 5

CSS 2.1标准给出了list-style直接应用于a的示例li.

虽然作者可以直接在列表项元素上指定"列表样式"信息(例如,HTML中的"li"),但是他们应该谨慎地这样做.

其次是:

ol.alpha li   { list-style: lower-alpha } /* Any "li" descendant of an "ol" */ 
ol.alpha > li { list-style: lower-alpha } /* Any "li" child of an "ol" */
Run Code Online (Sandbox Code Playgroud)

所以我会得出这样的结论:只要你小心并理解CSS规则的级联,就可以直接应用list-style-typelist-style-image列出项目.