Dave Haynes Dave Haynes - 1 year ago 66
HTML Question

Is there an easy way to change the color of a bullet in a list?

All I want is to be able to change the color of a bullet in a list to a light gray. It defaults to black, and I can't figure out how to change it.

I know I could just use an image; I'd rather not do that if I can help it.

Answer Source

The bullet gets its color from the text. So if you want to have a different color bullet than text in your list you'll have to add some markup.

Wrap the list text in a span:

  <li><span>item #1</span></li>
  <li><span>item #2</span></li>
  <li><span>item #3</span></li>

Then modify your style rules slightly:

li {
  color: red; /* bullet color */
li span {
  color: black; /* text color */
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download