CSS list-style

The CSS list-style property is a shorthand property for specifying styles for list items.

The list-style property is shorthand for the list-style-type, list-style-position and list-style-image properties.


These values are explained below.

Possible Values


Provides the value for the list-style-type property.

You can specify the list style type as one of the predefined counter styles (e.g., a disc, square, roman numerals, etc) or you can use your own customized counter style. You can create your own custom counter style with the @counter-style at-rule, then refer to that style in list-style by simply adding that counter style's name as the first value.

You can also provide a string as the value (the string becomes the marker) or use the symbols() function as a quick way to add a custom marker style.

See list-style-type for more detail and examples.


Provides the value for the list-style-position property. This property allows you to control the position of the ::marker pseudo-element in the list item.


Provides the value for the list-style-image property. This property is used to specify an image to be used as a list marker's default contents.

In addition, all CSS properties also accept the following CSS-wide keyword values as the sole component of their property value:

Represents the value specified as the property's initial value.
Represents the computed value of the property on the element's parent.
This value acts as either inherit or initial, depending on whether the property is inherited or not. In other words, it sets all properties to their parent value if they are inheritable or to their initial value if not inheritable.

General Information

Initial Value
Depends on the value of the individual properties. Their initial values are as follows:
Applies To
List item elements

Example Code

Official Specifications