HTML DOM Style listStyleImage प्रॉपर्टी

परिचय

HTML DOM Style listStyleImage प्रॉपर्टी का उपयोग लिस्ट आइटम मार्कर के रूप में एक इमेज सेट करने या वापस करने के लिए किया जाता है।

सिंटैक्स

object.style.listStyleImage = "none|url|initial|inherit"

मान और विवरण

मान	विवरण
`none`	यह डिफ़ॉल्ट मान है और कोई इमेज प्रदर्शित नहीं करता।
`url`	इमेज पथ निर्दिष्ट करने के लिए।
`initial`	इस प्रॉपर्टी को उसके प्रारंभिक मान पर सेट करता है।
`inherit`	पैरेंट एलिमेंट से प्रॉपर्टी मान विरासत में लेता है।

उदाहरण

<!DOCTYPE html>
<html>
<head>
<script>
  function changeListImage() {
    document.getElementById("LIST1").style.listStyleImage = 
      "url('https://upload.wikimedia.org/wikipedia/commons/thumb/0/05/Red_circle.svg/10px-Red_circle.svg.png')";
    document.getElementById("Sample").innerHTML = " लिस्ट मार्कर को लाल सर्कल इमेज से बदल दिया गया है";
  }
</script>
</head>
<body>
  <ul id="LIST1">
    <li>लिस्ट आइटम 1</li>
    <li>लिस्ट आइटम 2</li>
    <li>लिस्ट आइटम 3</li>
    <li>लिस्ट आइटम 4</li>
  </ul>
  <p>ऊपर की लिस्ट के लिए लिस्ट स्टाइल इमेज सेट करने के लिए नीचे दिए गए बटन पर क्लिक करें</p>
  <button type="button" onclick="changeListImage()">लिस्ट इमेज बदलें</button>
  <p id="Sample"></p>
</body>
</html>

आउटपुट

प्रारंभिक स्थिति (डिफ़ॉल्ट मार्कर):

HTML DOM Style listStyleImage प्रॉपर्टी

"लिस्ट इमेज बदलें" बटन पर क्लिक करने के बाद (कस्टम इमेज मार्कर):

HTML DOM Style listStyleImage प्रॉपर्टी