CSS लिस्ट-स्टाइल-टाइप प्रॉपर्टी का इस्तेमाल लिस्ट आइटम्स के मार्कर को स्टाइल करने के लिए किया जाता है। हम इन शैलियों को अव्यवस्थित और क्रमित दोनों सूचियों पर लागू कर सकते हैं।
सिंटैक्स
CSS लिस्ट-स्टाइल-टाइप प्रॉपर्टी का सिंटैक्स इस प्रकार है -
Selector {
list-style-type: /*value*/
} उदाहरण
निम्नलिखित उदाहरण सूचियों की शैली को स्पष्ट करते हैं
<!DOCTYPE html>
<html>
<head>
<style>
ol li {
padding: 5px;
list-style-type: lower-roman;
}
li:last-child {
font-size: 1.2em;
font-style: italic;
list-style-type: circle;
}
</style>
</head>
<body>
<ol>
<li>demo1</li>
<li>
demo 2
<ul>
<li>demo a</li>
<li>demo b</li>
</ul>
</li>
<li>demo 3</li>
</ol>
</body>
</html> आउटपुट
यह निम्न आउटपुट देता है -
उदाहरण
<!DOCTYPE html>
<html>
<head>
<style>
ol li {
width: 50%;
margin: 5px;
font-size: 1.2em;
list-style-type: devanagari;
border: thin solid;
background: linear-gradient(to right, lightgreen, pink,lightblue);
}
li:last-child {
font-style: italic;
list-style-type: lower-latin;
}
</style>
</head>
<body>
<ol>
<li>Eh!?</li>
<li>
demo one
<ol>
<li>What!?</li>
<li>demo two</li>
</ol>
</li>
<li>demo 3</li>
<li>demo four</li>
</ol>
</body>
</html> आउटपुट
यह निम्न आउटपुट देता है
