Coloured bullets in ul

HTML & CSS
1

Is it possible other than by using an image to have the bullets of a <ul> one colour and the text another colour? I’ve tried setting the ul color to one and the li to the other without success.

Cheers

2

Thanks Gary - easy when you think about it!

G :slight_smile:

(Posts crossed again. Have implemented and it looks good. Thanks again.)

3

Thanks. I know I can do it with an image. I wondered whether I could do it in some way without an image…

4

The bullet will be the same color as the list item. You can wrap your text in a span or other element, and give it a different color, e.g.

<ul>
  <li><span>this is the text</span></li>
</ul>
=============
li {
    color: green;
    }

li span {
    color: magenta;
    }

Another means is to use generated content. For an example, see my site. Note the bullets on the main nav and the toc when hovered. They change color from white (the bg color) to blue or magenta depending on whether they’ve been visited.

cheers,

gary

5

you can specify the list style image.

check this out http://www.w3schools.com/css/pr_list-style-image.asp

6

Oops, our posts crossed in the ether. Go back to post #3.

cheers,

gary