list-style-type

style.css

li.test { list-style-type: none;}
li.test1 { list-style-type: disc;}
li.test2 { list-style-type: circle;}
li.test3 { list-style-type: square;}
li.test4 { list-style-type: decimal;}
li.test5 { list-style-type: decimal-leading-zero;}
li.test6 { list-style-type: lower-roman;}
li.test7 { list-style-type: upper-roman;}
li.test8 { list-style-type: lower-greek;}

Value	Description
none	No marker is displayed.
disc	A filled circle is displayed. 'disc' is the initial value.
circle	An open circle is displayed.
square	A filled square is displayed.
decimal	Sequential numbers are displayed.
decimal-leading-zero	Sequential numbers with a leading zero are displayed.
lower-roman	Lowercase Roman numeral sequence is displayed.
upper-roman	Uppercase Roman numeral sequence is displayed.
lower-greek	Lowercase Greek numeral sequence is displayed.

<ul style="list-style-type: none;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: disc;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: circle;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: square;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: decimal;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: decimal-leading-zero;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: lower-roman;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: upper-roman;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

<ul style="list-style-type: lower-greek;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

※ Version data is based on MDN.

Specifies the marker for li elements (and elements with 'display' set to 'list-item' or 'inline-list-item').

Specifying the 'list-style-type' property on a parent element (such as ul or ol) that can contain marker elements applies that marker to all child elements.

<p>The ul element below has 'list-style-type: decimal'.</p>
<ul style="list-style-type: decimal;">
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
	<li>This is a li element.</li>
</ul>

You can also specify 'list-style-type' individually on li elements (or elements with 'display' set to 'list-item' or 'inline-list-item') to give each one a different marker. Sequential counter values are preserved for elements sharing the same parent.

<p>The li elements below each have a different value for 'list-style-type'.</p>
<ul>
	<li style="list-style-type: disc;">'list-style-type: disc' is specified.</li>
	<li style="list-style-type: circle;">'list-style-type: circle' is specified.</li>
	<li style="list-style-type: decimal;">'list-style-type: decimal' is specified.</li>
	<li style="list-style-type: decimal-leading-zero;">'list-style-type: decimal-leading-zero' is specified.</li>
	<li style="list-style-type: lower-roman;">'list-style-type: lower-roman' is specified.</li>
</ul>

Note that when both 'list-style-type' and 'list-style-image' are specified at the same time, the value of 'list-style-image' takes priority.