CSS lists, both ordered and unordered, can be customized in a variety of ways using the list-style-type property.

CSS Ordered Lists

The list-style-type property accepts any one of twelve different values for ordered lists.

ol {
  list-style-type: none;
  list-style-type: decimal; (Example: 1, 2, 3, 4, 5, etc.)
  list-style-type: decimal-leading-zero; (Example: 01, 02, 03, 04, 05, etc.)
  list-style-type: lower-alpha; (Example: a, b, c, etc.)
  list-style-type: upper-alpha; (Example: A, B, C, etc.)
  list-style-type: lower-latin; (Example: a, b, c, etc.)
  list-style-type: upper-latin; (Example: A, B, C, etc.)
  list-style-type: lower-roman; (Example: i, ii, iii, iv, v, etc.)
  list-style-type: upper-roman; (Example: I, II, III, IV, V, etc.)
  list-style-type: lower-greek; (Example: alpha, beta, gamma, etc.)
  list-style-type: armenian; (Traditional Armenian Numbering)
  list-style-type: georgian; (Example: an, ban, gan, etc.)
}

CSS Unordered Lists

The list-style-type property accepts any one of four different values for unordered lists.

ul {
  list-style-type: none;
  list-style-type: disc;
  list-style-type: circle;
  list-style-type: square;
}

Using Images As List Markers

The list-style-image property allows an image to be set as the list marker in place of normal bullets. Although this property can be applied to both ordered lists and unordered lists, it is better to apply it only to unordered lists, and to specify the list-style-type property as well, so that it can be used if the image is for some reason unavailable.

ul {
  list-style-image: url('../images/bullet.gif');
  list-style-type: disc;
}

These two preferences can be set in one declaration using the list-style property.

ul {
  list-style: disc url('../images/bullet.gif');
}

• This Is An Unordered List With Images Replacing the Bullets Using CSS
• What do you call an ant who skips school?
• A truant!