HOW TO SET UL/LI BULLET POINT COLOR?

Mark Devid

Total Post:102

Points:714
Posted by  Mark Devid
 1722  View(s)
Ratings:
Rate this:
Hi!

Normally, the bullet point in ul/li is a black solid circle. I want to change the style of it, like I want to set the color of the bullet point to be green, I also want to change the bullet point to be a square. Anyone knows how to do that?

please give me right solution

  1. shreesh chandra shukla

    Post:105

    Points:735
    Re: how to set ul/li bullet point color?

    Hi!

    A couple ways this can be done:

    This will make it a square

    ul

    {

      list-style-type: square;

    }

    This will make it green

    li

    {

      color: #0F0;

    }

    This will prevent the text from being green

    li p

    {

      color: #000;

    }

    However that will require that all text within lists be in paragraphs so that the color is not overridden.

    A better way is to make an image of a green square and use:

    ul

    {

      list-style: url(green-square.png);

    }

Answer

NEWSLETTER

Enter your email address here always to be updated. We promise not to spam!