|Home | Web Design Tutorials | Free Graphics | Custom Graphics | Newsletter | Products | Specials | SEO | Sound Effects | Benefits | Login | View Cart|
Using Image Bullets on HTML ListsWhy would anyone want to use custom bullets for their lists?
<ul style="list-style-image: url(imageBullet.gif);"> <li>List item 1</li> <li>List item 2</li> </ul>Just change imageBullet.gif to the name and file type of the image you want to use as bullets, and include the path if the image is kept in a separate folder, and you're all set. For a visually appealing list, don't use images that are too large.
The second way is to just use a definition list (which doesn't use bullets) and use an image in front of the list item content. It's a little less official, but it works just the same. It goes like this, Mr. GiggleFinkle:
<dl> <dd><img src="checkmark.gif" width="26" height="14">List item text</dd> <dd><img src="checkmark.gif" width="26" height="14">List item text</dd> </dl>Hey, that's pretty easy, too! I'll bet you could have figured that out for yourself if you would have had a rubber duckie and a half a chance.
Hey #2, did you know we can learn a lot from a box of crayons? Each one is a different color but they all live together in harmony in the same box.
That doesn't seem so hard.
Almost a NewsletterChanging list hosts. Will post a new subscribe form shortly.
Did you know...The member's site has about 100 standards compliant HTML and CSS tutorials, 31 handy reference charts, reprintable content, web graphics, exclusive fonts, free software, free ebooks and more? All this for less than 9 cents a day! [ Details ]
Home | Web Design Tutorials | Free Graphics | Newsletter | Products | Specials | SEO | Sound Effects | Press Room