CSS allows to create new type of lists to define the visual formatting of the lists. Custom lists can be created by setting the value of "display" property of an element to list-item.
The list-style-type property is used to define the leading symbol that is rendered for each list item.
The possible values are.
disc | circle | square |
decimal | decimal-leadin-zero |
lower-roman | upper-roman |
lower-greek |
lower-alpha | upper-alpha |
lower-latin | upper-latin |
herbian | Armenian | Georgian |
cjk-ideographic | hiragana | katakana | hirogana-iroha | katokana-iroha |
none |
The list-style-image property allows to define a leading image that is rendered for each list item.
The possible values are.
| <url> | e.g. url("fellas.jpg") |
none |
The list-style-position property allows to define the position (inside or outside of the list item box) for the leading symbol/ image that is rendered for each list item.
The possible values are.
inside | |
outside | (default value) |
The list-style property is the shorthand to define the style of the list item.
The possible values are.
<list-style-type> <list-style-position> <list-style-image>
