[Tutorial] How to Change Colour Of Bullet Points Using CSS – Web Designing Tuts

Basically,When we try to add bullet points using html codes(i.e,Unordered Lists),they are displayed in black color.So how to Change color of bullet points.We have a Css trick for it !

How to Change Colour Of Bullet Points Using CSS - Web Designing

<ul>
<li><span>one</span>
</li>
<li><span>one</span>
</li>
<li><span>one</span>
</li>
<li><span>one</span>
</li>
</ul>

Applying CSS for Above Unordered Lists :

ul {
list-style-type:
square;
list-style-position: outside;
list-style-image: none;
color:#f00;
}
li {
color:#f00;
}
li span {
color:#999;
}

And Here is the Output after Applying the above CSS Code :

  • one
  • one
  • one
  • one
Note :
You can Change 
list-style-type: to Circle etc to Get Bullets Shape of Your Choice..

Eg for list-style-type:circle

  • one
  • one
  • one
  • one



Hope You Liked This Tutorial,Stay Tuned for More..Still Any Doubts..Feel Free to Post Comments below..

0 0 votes
Article Rating
Subscribe
Notify of
guest
0 Comments
Inline Feedbacks
View all comments