css 列表 li 一种颜色,另一种颜色的文字 /只要 CSS/

我有一个列表:

HTML:


<ul>
<li>text</li>
<li>text</li>
<li>text</li>
</ul>
<ol>
<li>text</li>
<li>text</li>
<li>text</li>
</ol>


CSS:


ul li {
list-style-type: disc;
margin-left: 2em;
color: black;
}
ol li {
list-style-type: decimal;
margin-left: 2em;
color: black;
}


例子:
http://jsfiddle.net/mikehudak/T4NVj/
问题:

如何改变
disc/decimal

/dots/numbers/ 在 li 在

红色的

颜色,没有。
text

将有

黑色的

颜色?

我无法改变 html !

为了更好的想象力,我想要实现的目标:


谢谢你的回复。
已邀请:

卫东

赞同来自:

我用标签了解这一点
::pseudoElement


决定:


ul li {
list-style-type: disc;
margin-left: 2em;
color: red;
}
ol li {
list-style-type: decimal;
margin-left: 2em;
color: red;
}
ol li:first-line, ul li:first-line {
color: black;
}


例子:
http://jsfiddle.net/mikehudak/T4NVj/12/

涵秋

赞同来自:

好的,这样的事情怎么样? 它使用伪元素 before 并宣布标记 unicode.

JSFiddle: http://jsfiddle.net/T4NVj/11/


ul li {
margin-left: 2em;
color: black;
list-style:none;
}


ul li:before {
content: '\2022';
color: red;
display: block;
height: 5;
width: 5;
left: -0.7em;
top: 1.2em;
position: relative;
}

江南孤鹜

赞同来自:

如果你不能改变 html, 然后你唯一的选择是使用图像 -


ul li { 
list-style-image: url/path_for_red_color_image.jpg/;
}

要回复问题请先登录注册