Design tip #4: HTML Snippets Series - bullets and bars

by Hamish Long

You can jazz up a plain looking html page with some coloured bullets and bars. Here's an example:

For the green bar you use:
<hr style="color: #66cc00; background-color: #66cc00; height: 10px;">
and can change the colour and size to match your needs.

For the bulleted list:
<UL style="LIST-STYLE-IMAGE: url(images/bullet.gif)">
in this example I have my bullet image in a subfolder called "images".
I find the best size bullet image is 6x6px with a 4px space above it.