有啥方法可以使用 css [重复] 更改列表样式圆圈的颜色

Posted 2023-02-23

【中文标题】有啥方法可以使用 css [重复] 更改列表样式圆圈的颜色

【英文标题】：Is there any way to change color of the list-style circle using css [duplicate]有什么方法可以使用 css [重复] 更改列表样式圆圈的颜色

【发布时间】：2012-01-08 17:24:15

【问题描述】：

可能重复：How to define the Color of Bullets in UL/LI Lists via CSS, WITHOUT using any image bullets or any span tag?

如何使用 css 改变列表样式圆圈的颜色

我的 CSS 是：

 ul
   list-style:circle;
 

【参考方案1】：

试试这个。

    <ul>
    <li><span>text</span></li>
    </ul>

    ul li 
       list-style:circle;
       color:blue;
     

    ul li span 
       color:#000;
     

【讨论】：

谢谢大家，一切正常：)

【参考方案2】：

有：

ul 
    list-style:circle;
    color:blue;

对于其他字体颜色另外这样做：

ul span 
    color:black;

和html：

<ul>
    <li><span>This is a black line</span></li>
</ul>

【讨论】：

现在文字颜色也变成蓝色了，我不想这样，我只想改变圆圈颜色..

这就是我编辑答案的原因；）

【参考方案3】：

Soufiane Hassou 提到的主题中的答案是最好的方法，但如果您不介意在 li 中使用 span，您可以使用：

ul
    
        list-style: circle;
        color: #FF0000;
    

    ul span
    
        color: Black;
    

HTML 在哪里：

<ul>
    <li>
        <span>Test-text</span>
    </li>
</ul>

这会将子弹标记为红色，但将文本标记为黑色。

【讨论】：

谢谢大家，一切正常：)