Javascript DOM CSS Style listStyleImage Property

Introduction

Specify an image as the list-item marker in a list: 

document.getElementById("myList").style.listStyleImage = "url('image3.png')";

View in separate window 

<!DOCTYPE html>
<html>
<body>

<ul id="myList">
  <li>CSS</li>
  <li>HTML</li>
  <li>SQL</li>
  <li>C++</li>
</ul>//from w  w w . j  ava  2 s  .  c  om

<button type="button" onclick="myFunction()">Change list-item marker</button>

<script>
function myFunction() {
  document.getElementById("myList").style.listStyleImage = "url('image3.png')";
}
</script>

</body>
</html>

The listStyleImage property sets or gets an image as the list-item marker.

Property Values

Value Description
noneNo image displayed. default
url Specifies the path to the image
initial Sets this property to its default value.
inherit Inherits this property from its parent element.

The listStyleImage property returns a String representing the location path of the image.




PreviousNext

Related