Use Images Instead of Black Buttons for an Ordered List

How to Replace The Black Dots of a Bullet List with Graphical Buttons

The easiest way to do this is with the definition list tags.
What we do is begin the list with <dl>. surround each line of the list with <dd> and </dd> tags, and then we finish the line with the </dl> tag.
Real easy to do and you now no longer have ugly black buttons in your list but any graphical button you can find or make.
Here is what we now get instead of the black buttons;

This is the first item

This is the second item

This is going to be a long line. I am attempting to show you what happens when we get to the end of the viewers computer monitor. If everything goes right it should start the first character directly under the last image for our list. Pretty cool and very simple to do ...

Here is the code I used to create this effect. You will need to replace the image's URL's with the location of your own images. I am not including the two <big> tags I have surrounding the example, though I personally like big text as it makes it so much easier on my tired old eyes.

Copy the code, replace the images with your own and change the text to fit your auction or webpage. You are not limited in the number of images or lines for your list, use your imagination. The images in the demo are free images so feel free to copy and use them but please do not hotlink to any images on my site without express permission by me.