list-style-image
Description
The list-style-image property for CSS specifies the marker image, which is used to fill the list item's marker when its content is normal.
Syntax
CSS
list-style-image: value;
JS
object.style.listStyleImage = "value";
Values
<'list-style-image'> = <image> | none
<image> = <url> | <gradient>
<url> = url( <string> <url-modifier>* )
<string>
Specifies a sequence of characters delimited by double quotes (") or single quotes (').
<url-modifier>
Changes the meaning or the interpretation of the URL.
<gradient> = <linear-gradient()> | <repeating-linear-gradient()> | <radial-gradient()> | <repeating-radial-gradient()>
<linear-gradient()> = linear-gradient( [ <angle> | to <side-or-corner> ]? , <color-stop-list> )
<angle>
deg
Degrees. There are 360 degrees in a full circle.
grad
Gradians, also known as "gons" or "grades". There are 400 gradians in a full circle.
rad
Radians. There are 2p radians in a full circle.
turn
Turns. There is 1 turn in a full circle.
<side-or-corner> = [left | right] || [top | bottom]
left
Left.
right
Right.
top
Top.
bottom
Bottom.
<color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#
<linear-color-stop> = <color> && <length-percentage>?
<color>
Specifies the color using a keyword or a numerical specification.
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<linear-color-hint> = <length-percentage>
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<repeating-linear-gradient()> = linear-gradient( [ <angle> | to <side-or-corner> ]? , <color-stop-list> )
<angle>
deg
Degrees. There are 360 degrees in a full circle.
grad
Gradians, also known as "gons" or "grades". There are 400 gradians in a full circle.
rad
Radians. There are 2p radians in a full circle.
turn
Turns. There is 1 turn in a full circle.
<side-or-corner> = [left | right] || [top | bottom]
left
Left.
right
Right.
top
Top.
bottom
Bottom.
<color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#
<linear-color-stop> = <color> && <length-percentage>?
<color>
Specifies the color using a keyword or a numerical specification.
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<linear-color-hint> = <length-percentage>
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<radial-gradient()> = radial-gradient( [ <ending-shape> || <size> ]? [ at <position> ]? , <color-stop-list> )
<ending-shape>
Determines whether the gradient's ending shape is a circle or an ellipse.
<size>
Determines the size of the gradient's ending shape.
<position> = [ [ left | center | right ] || [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ]? | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ] ]
left
Left.
center
Center.
right
Right.
top
Top.
bottom
Bottom.
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#
<linear-color-stop> = <color> && <length-percentage>?
<color>
Specifies the color using a keyword or a numerical specification.
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<linear-color-hint> = <length-percentage>
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<repeating-radial-gradient()> = radial-gradient( [ <ending-shape> || <size> ]? [ at <position> ]? , <color-stop-list> )
<ending-shape>
Determines whether the gradient's ending shape is a circle or an ellipse.
<size>
Determines the size of the gradient's ending shape.
<position> = [ [ left | center | right ] || [ top | center | bottom ] | [ left | center | right | <length-percentage> ] [ top | center | bottom | <length-percentage> ]? | [ [ left | right ] <length-percentage> ] && [ [ top | bottom ] <length-percentage> ] ]
left
Left.
center
Center.
right
Right.
top
Top.
bottom
Bottom.
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<color-stop-list> = <linear-color-stop> , [ <linear-color-hint>? , <linear-color-stop> ]#
<linear-color-stop> = <color> && <length-percentage>?
<color>
Specifies the color using a keyword or a numerical specification.
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
<linear-color-hint> = <length-percentage>
<length-percentage> = <length> | <percentage>
<length>
Specifies the length using a number followed by a unit of measurement.
<percentage>
Specifies the percentage using a number followed by a percent sign (%).
none
The element has no marker image.
Initial
none