<!DOCTYPE html>
<html>
<head>
<title>CSS list-style property</title>
<style>
.one {
list-style: upper-latin inside;
}
.two {
list-style: upper-latin outside;
}
.three {
list-style: square inside;
}
.four {
list-style: square outside;
}
</style>
</head>
<body>
<code><b>Ordered list with inside position</b></code>
<ol class="one">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
<br />
<code><b>Ordered list with outside position</b></code>
<ol class="two">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ol>
<br />
<code><b>Unordered list with inside position</b></code>
<ul class="three">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
<br />
<code><b>Unordered list with outside position</b></code>
<ul class="four">
<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>
</ul>
</body>
</html>