Categories
CSS HTML

Styling UL / LI lists with CSS

  1. Changing the style of the bullet:
    1. list-style-type: square; Or disk, or circle, or square
    2. list-style-type: none; No bullets
    3. use margin-top and margin-bottom to add spaces between bullets
  2. Putting an image as the bullet:
    1. list-style-image: url(images/bullet.gif);
    2. But it is better to use background images, since you have little control over the placement of the image
  3. Display lists horizontally:
    1. display: inline; and list-style-type: none;

Leave a Reply

Your email address will not be published. Required fields are marked *