CSS list-style-type Property

CSS list-style-type property specifies the marker style of a list item element.

Usages

The following table outline the usages and version history of this property.

Default value: disc
Applies to: List items
Inherited: Yes
Version: CSS1
JavaScript Syntax: object.style.listStyleType = "lower-alpha"

Syntax

Here is a syntax for the CSS list-style-type property

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

Property Values

The following table describes the values of this property.

Value Description
disc Default. Set the filled circle
circle Set the hollow circle
square Set the filled square
decimal Set the decimal numbers starting with 1
decimal-leading-zero Set the decimal numbers starting with 1, padded with 0 at the front for numbers less than 10
lower-roman Set the lowercase roman numerals
upper-roman Set the uppercase roman numerals
lower-greek Set the lowercase greek
lower-alpha Set the lowercase ASCII letters
lower-latin Set the lowercase ASCII letters
upper-alpha Set the uppercase ASCII letters
upper-latin Set the uppercase ASCII letters
armenian Set the armenian numbering
georgian Set the georgian numbering
initial Sets default value of this property
inherit Inherits this property from its parent element

Examples

The example below shows to sets list-style-type property.

.one {
  list-style-type: square;
}
.two {
  list-style-type: circle;
}
.three {
  list-style-type: decimal;
}
.four {
  list-style-type: lower-alpha;
}

Run it...   »

Browser Compatibility

  • Google Chrome 1+
  • Mozilla Firefox 1+
  • Internet Explorer 4+
  • Opera 3.5+
  • Safari 1+

Note: Here details of browser compatibility with version number may be this is bug and not supported. But recommended to always use latest Web browser.