CSS Tutorial – 21 – List

The list properties deal specifically with the list elements.

List-style-type

List-style-type is used to select a list-item marker from a set of predefined values. The default value is “disc”.

list-style-type : 
  inherit | none | disc | circle | square | decimal | 
  upper-alpha | lower-alpha | upper-roman | lower-roman |
  lower-greek | lower-latin | armenian | georgian | 
  decimal-leading-zero

List-style-image

The list-style-image property allows a custom image to be used as the list bullet. The image path is specified inside of the CSS url function. This property will overshadow any marker type selected with the list-style-type property.

list-style-image : inherit | none | url(<url>)

List-style-position

List-style-position gives an alternative for where the bullet is placed. The bullet can be positioned either “outside” of the element box, which is the default, or “inside” of it.

list-style-position : inherit | outside | inside

List-style

List-style is the shorthand property for setting all of the list properties. The values can be set in any order since there is no ambiguity. Either one of the values may be omitted, in which case the default value will be used.

list-style : <list-style-type> + <list-style-image> + 
             <list-style-position>

Recommended reading:
Sams - Teach Yourself HTML and CSS in 24 Hours

PVT book:
Handbook of C++ Syntax