Disc, Circle, Square – Unordered List Style Types

by on July 9th, 2007

Lists in HTML can be ordered or unordered. Unordered list style type can be disc, circle, square, decimal, lower-roman, upper-roman, lower-alpha, upper-alpha or none.

Disc bullets list
<ul type="disc">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
Circle bullets list
<ul type="circle">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>
Square bullets list
<ul type="square">
<li>Apples</li>
<li>Bananas</li>
<li>Lemons</li>
<li>Oranges</li>
</ul>

We can also define this style in CSS file or in head section of web page like following: (For circle list style)

<style type="text/css">
ul, li { list-style: circle; }
</style>

This style will be applied all the lists in a given web page.


Share