The following describes how to add cool website bullets and arrows to a web page. Bullets are great for adding emphasis to blocks of text and can really draw the reader's attention to important information. I use bullets all the time both in my Word documents and on live web pages. I think you'll find some of the following tips useful for how to add bullets and arrows to your website through HTML, HTML ASCII code, and image bullets applied through CSS or in tables.
First lets start with the typical HTML website bulleted lists (called Unordered lists) you see most often on web pages. These instructions below tell you how to add an unordered list.
In your HTML document inside the <body> source code create the following with <ul> and <li> tags:
This will create the simplest bulleted list with solid circle-shaped bullets. If you want square bullets change your opening <ul> tag as follows:
<---as you see this style creates square-shaped bullets
List style types include square, disc, circle, and none. List style type circle adds a hollow circle in contrast to the solid circle when there is no style added.
Adding cool custom images as website bullets is very easy by applying the list-style-image as shown below. Included are arrow bullets, primitive bullets, space invaders, particle bullets, bar codes, and skull bullets.
<ul style="list-style-image: url('yourimage.gif');">
Here is a sampling below of website bullets that are free for download.
You can also use certain ASCII code for bullets or arrows and place them in front of text. Here are a few that I have used:
STANDARD BULLET SHAPES
ARROW BULLET SHAPES