HTML Lists

There are two main types of lists in HTML: ordered lists and unordered lists. Each can be formatting many ways.

Example: HTML Ordered List (default)

The default for an ordered list is numbers.


	<p>Top 5 Programming Lanugages</p>
	
	<ol>
		<li>Java
		<li>C
		<li>C++
		<li>Python
		<li>C#
	</ol>
	

Run it now


Example: HTML Ordered List (alphabetically ordered list, uppercase)

The type of list can be formatting many other ways, e.g. upper/lower case alphabetically , roman numerals, etc. The example below demonstrates this with the type attribute. However, the use of CSS to accomplish this is recommended over this method.


	<p>Top 5 Programming Lanugages</p>
	
	<ol type="A">
		<li>Java
		<li>C
		<li>C++
		<li>Python
		<li>C#
	</ol>
	

Run it now


Example: HTML Unordered List (default)

The default for an unordered list is solid.


	<p>Top 5 Programming Lanugages</p>
	
	<ul>
		<li>Java
		<li>C#
		<li>C++
		<li>PHP
		<li>Python
	</ul>
	

Run it now


Example: HTML Unordered List (cirlce)

The type of list can be formatting many other ways, e.g. circle, disc, square, none, etc. The example below demonstrates this with the type attribute. However, the use of CSS to accomplish this is recommended over this method.


	<p>Top 5 Programming Lanugages</p>
	
	<ul type="circle">
		<li>Java
		<li>C#
		<li>C++
		<li>PHP
		<li>Python
	</ul>
	

Run it now


Example: HTML Unordered List (using an Image)

You can also use images for lists. This requires CSS.


	<p>Top 5 Programming Lanugages</p>
	
	<ul style="list-style-image: url('bball.jpg')">
		<li>Java
		<li>C#
		<li>C++
		<li>PHP
		<li>Python
	</ul>
	

Run it now