The property list-style-image sets the image that will be used as the list item marker. When list-style-image set and image is available, it will replace the marker set with the list-style-type marker.
CSS property list-style-image
| CSS version: | CSS 2.1 |
| Value: | uri | none | inherit |
| Initial: | none |
| Applies to: | elements with 'display: list-item' |
| Inherited: | yes |
Example – list-style-image
<style>
ul {
background-color: lightgreen;
width: 200px;
list-style-image: url("/img/star_10x10.png");
}
li {background-color:lightgray;}
</style>
<ul>
<li>item1</li>
<li>item2</li>
<li>item3</li>
</ul>Related
- CSS list-style - shorthand for list marker type, image and position
- CSS list-style-type - specify marker (disc, square, numeric, etc.) for a list
- CSS list-style-position - specify if list markers will be outside or inside
- HTML li tag
- HTML ol tag
- HTML ul tag
