[thelist] Bullets

rudy r937 at interlog.com
Sun Jun 3 09:47:46 CDT 2001


> Is there a cross browser way to change the
> color/style of a bullet using CSS?
>
> eg: make a <ul> bullet red, and a <ol> bullet bold

hi annie

in general, i would agree with the aardvark's advice to dive into the w3c
specs... just make sure you get a good night's sleep first    =o)

yes, you can change the colour or weight of the *bullets* and leave the
rest of the text alone, but it takes some finagling, and the w3c is not
known for finagling

if you apply a color to the <ul>, it cascades to the items within the list,
so you have to style the content *within* the items back to the colour you
want

try this --

   <style>
    .red { color: #FF0000 }
    .green { color: #00FF00 }
    .blue { color: #0000FF }
    .black { color: #000000 }
   </style>

   <ul>
   <li>ordinary list
   <li>no styling
   </ul>

   <ul class="red">
   <li>class="red"
   <li>on the ul tag
   </ul>

   <ul class="red">
   <li class="green">class="green"
   <li class="green">on the li tags
   </ul>

   <ul class="red">
   <p>class="red" on the ul tag
   <li class="green"><p class="black">class="green/blue" on the li
tags</li>
   <li class="blue"><p class="black">class="black" on the li p tags</li>
   </ul>

these techniques work in windows ie4+ and netscape4+, but i cannot vouch
for how thoroughly cross-browser they are

note that on the last example i closed the <li> tags -- this was to make
netscape 4.75 behave


helps?

rudy
http://rudy.ca/








More information about the thelist mailing list