CSS Property list-style








list-style shorthand property sets all the list-style properties.

Summary

ItemValue
Initial value disc outside none
Inherited Yes.
Version CSS1
JavaScript syntax object.style.listStyle="decimal inside"
Applies to Elements whose display value is list-item.

CSS Syntax

list-style: list-style-type | list-style-position | list-style-image




Property Values

The property values are listed in the following table.

Value Description
list-style-type Set the type of list-item marker. See list-style-type for possible values
list-style-position Set where to place the list-item marker. See list-style-position for possible values
list-style-image Set the image for of list-item marker. See list-style-image for possible values
inherit Inherit the value of the list-style property from the parent element

Browser compatibility

list-style Yes Yes Yes Yes Yes




Example

The following code loads an image for ul and use the image as the bullet points.

<!DOCTYPE HTML>
<html>
<head>
    <style>
ul {<!--from   w w  w  .  j a v  a  2s  .co m-->
 font-family: sans-serif;
 list-style: disc outside url('http://java2s.com/style/demo/border.png');
}
    </style>
</head>
<body>
    <ul>
        <li>jpg</li>
        <li>exe</li>
        <li>zip</li>
    </ul>
</body>
</html>

Click to view the demo