CSS Bullet Color

Sometimes you might want to set the bullets on an unordered list to a different color from the list items.

Here’s a way to do this with CSS using the <span> tag on the list:

ul.myList li {
color:#red;
}
ul.myList li span {
color:#blue;
}

In the file, your html will go like this:

<ul class=”myList”>
<li><span>first item</span></li>
<li><span>second item</span></li>
<li><span>third item</span></li>
<li><span>fourth item</span></li>
</ul>