CSS list-style-type property
Set some different list styles:
ul.circle {list-style-type:circle}
ul.square {list-style-type:square}
ol.upper-roman {list-style-type:upper-roman}
ol.lower-alpha {list-style-type:lower-alpha}
ul.square {list-style-type:square}
ol.upper-roman {list-style-type:upper-roman}
ol.lower-alpha {list-style-type:lower-alpha}
Try it out . . .
There are more examples at the bottom of this page.
Description of property definition and use
The list-style-type property sets the type of list item tag.
| Default: | "disc" for <ul> and "decimal" for <ol> |
|---|---|
| Inherited: | yes |
| Version: | CSS1 |
| JavaScript syntax: | object .style.listStyleType="square" |
Browser support
The numbers in the table support the first browser version number of the property.
| Attributes | |||||
|---|---|---|---|---|---|
| list-style-type | 1.0 | 4.0 | 1.0 | 1.0 | 3.5 |
The property value
| Value | Describe |
|---|---|
| none | No tags. |
| disc | Default. The marker is a solid circle. |
| circle | The marker is a hollow circle. |
| square | The marker is a solid square. |
| decimal | The marker is a number. |
| decimal-leading-zero | The number marker at the beginning of 0. ( 01, 02, 03, etc. ) |
| lower-roman | Small Roman numerals (i, ii, iii, iv, v, etc.). ) |
| upper-roman | Capital Roman numerals (I, II, III, IV, V, etc.). ) |
| lower-alpha | Lowercase English letter The marker is lower-alpha (a, b, c, d, e, etc.). ) |
| upper-alpha | Capital letters The marker is upper-alpha (A, B, C, D, E, etc.). ) |
| lower-greek | Lowercase Greek letters (alpha, beta, gamma, etc.). ) |
| lower-latin | Lowercase Latin letters (a, b, c, d, e, etc.). ) |
| upper-latin | Capital Latin letters (A, B, C, D, E, etc.). ) |
| hebrew | Traditional Hebrew numbering |
| armenian | Traditional Armenian numbering |
| georgian | Traditional Georgian numbering (an, ban, gan, etc.). ) |
| cjk-ideographic | A simple esoic number |
| hiragana | The tags are: a, i, u, e, o, ka, ki, etc. (Japanese film pseudonym) |
| katakana | Tags are: A, I, U, E, O, KA, KI, etc. (Japanese film pseudonym) |
| hiragana-iroha | The tags are: i, ro, ha, ni, ho, he, to, etc. (Japanese film pseudonym) |
| katakana-iroha | Tags are: I, RO, HA, NI, HO, HE, TO, etc. (Japanese film pseudonym) |
More instances
A list of all the different list item tags
This example demonstrates all the different list item tags.
Related articles
CSS tutorial: CSS list
CSS Reference Manual: List-style properties