change li bullet color

By | September 7, 2015

change li bullet color

Everytime , when we add li (list style) in our html codes , it displayed in black color (for Unordered Lists). if you want to change black color in any other color you want . here simple css code for this.
First i show you some different style of Unordered Lists (ul) example.

  • codefewer
  • codefewer
  • codefewer
  • codefewer
  • codefewer
  • codefewer
  • codefewer
  • codefewer
  • codefewer

now i tell you how to change bullet default color with another color.

Html Code:


<div class=”blue”>
<ul>
<li>codefewer</li>
<li>codefewer</li>
<li>codefewer</li>
</ul>
</div>

Css Code:

.blue ul {
list-style: none;
padding:0;
margin:0;
}
.blue ul li { 
padding-left: 1em; 
text-indent: -.7em;
}
.blue ul li:before {
content: “.”;
color:blue; /* or whatever color you want*/

font-size:5em;

}

if you have any question and you need any help , feel free Post Comments below.

One thought on “change li bullet color

Leave a Reply

Your email address will not be published. Required fields are marked *