Various list properties are:
- list-style-type: It can be any shape like circle, square, upper-roman, lower-alpha.
- list-style-position: It specifies whether the list items appear inside or outside the content flow.
- list-style: It allows all the list style property into a single expression.
- list-style-image: It allows to specify an image it can use as our own bullet style.
Example: Demonstration of link property
<html>
<head>
<style>
ul.a {list-style-position:outside;list-style-type:circle;}
ul.b {list-style-position:inside;list-style-type:square;}
ol.c {list-style-position:outside;list-style-type:decimal;}
ol.d {list-style-position:inside;list-style-type:lower-alpha;}
ol.e{list-style: upper-roman outside;}
</style>
</head>
<body>
<p>Example of various list properties</p>
<ul class="a">
<li>Chemistry</li>
<li>computer Science</li>
<li>Physics</li>
</ul>
<ul class="b">
<li>Tea</li>
<li>Coffee</li>
<li>Cold drink</li>
</ul>
<ol class="c">
<li>Chemistry</li>
<li>computer Science</li>
<li>Physics</li>
</ol>
<ol class="d">
<li>Tea</li>
<li>Coffee</li>
<li>Cold drink</li>
</ol>
<ol class="e">
<li>Chemistry</li>
<li>computer Science</li>
<li>Physics</li>
</ol>
</body>
</html>
Output:
