CSS list-style-image Property


The list-style-image CSS property specifies the image that will be used as the list item marker.

Syntax

 
list-style-image: none | url | initial | inherit;

Example

x
 
<!DOCTYPE html>
<html>
<head>
    <style>
        ul  {
            list-style-image: url("https://webtutor.dev/images/icon.png");
        }
    </style>
</head>
<body>
<ul>
    <li>HTML</li>
    <li>CSS</li>
    <li>JavaScript</li>
</ul>
</body>
</html>
Preview

Property Values

Value Description
none There will be no image displayed. Instead, the list-style-type property specifies the type of list marker that will be displayed. This is the default setting.
url The image path to be used as a list-item marker.
initial This property is set to its default value.
inherit This property is inherited from its parent element.

Supported Browsers

Property Chrome Firefox Safari Edge / IE Opera
list-style-image 1.0 1.0 1.0 4.0 7.0