list-style

Description

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

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.

Syntax and Property Values


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

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

Example

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


<!DOCTYPE HTML>
<html>
<head>
    <style>
ul {<!--   w w  w  . ja  va2s  .co  m-->
 font-family: sans-serif;
 list-style: disc outside url('http://java2s.com/style/download.png');
}
    </style>
</head>
<body>
    <ul>
        <li>jpg</li>
        <li>exe</li>
        <li>zip</li>
    </ul>
</body>
</html>

Click to view the demo

The code above generates the following result.

list-style




















Home »
  HTML CSS »
    HTML CSS Reference »




HTML Tag Reference
CSS Reference
CSS Selector Reference
Encoding Reference