in the name of allah
main tutorials downloads forums links contact us  
Arabtut>tutorials>CSS tutorials
making a custom bullets

Bullets are the the little dots that you see when you make a list of stuff using the <ul> tag like the sample below

  • first
  • second
  • third

to change these bullets, simply put this code in your CSS file

li.bullet {

in this code we have li.newbullet which is the style sheet rule and /images/arrow.gif is the location of the image - you must change it

next, we need to apply the CSS rule to each bullet

<li class="bullet">first</li>
<li class="bullet">second</li>
<li class="bullet">third</li>

That is it. Now test the page and you will find that the bullets have changed to the picture we choose.

All Copyrights Reserved Arabtut© 2006