HTML List


HTML Supports Ordered, Unordered, and Definition Lists:

HTML List

Ordered List

  1. First List Item
  2. Second List Item
  3. Third List Item

Unordered List

  • List Item
  • List Item
  • List Item

实例

Online Example

Unordered List
This example demonstrates an unordered list.

Ordered List
This example demonstrates an ordered list.

(You can find more examples at the bottom of this page.)


HTML unordered list

An unordered list is a list of items, each item is marked with bolded circles (typical small black circles).

Unordered List Uses <ul> Tag

<ul>
<li>Coffee</li>
<li>Milk</li>
</ul>

Browser displays as follows:

  • Coffee
  • Milk

HTML ordered list

Similarly, an ordered list is a list of items, each item is marked with numbers. An ordered list starts with <ol> Tag. Each list item starts with <li> Tag.

List Item Uses Numbers to Mark

<ol>
<li>Coffee</li>
<li>Milk</li>
</ol>

Browser displays as follows:

  1. Coffee
  2. Milk

HTML Custom List

Custom List is not just a list of items, but a combination of items and their comments.

Custom List Starts with <dl> Tag. Each Custom List Item Starts with <dt> Tag. Each Custom List Item's Definition Starts with <dd> Tag.

<dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>

Browser displays as follows:

Coffee
- black hot drink
Milk
- white cold drink

Important Notes - Useful Tips

Tip:List Items can contain paragraphs, line breaks, images, links, and other lists, etc.


Examples

More Examples

Different Types of Ordered Lists
This example demonstrates different types of ordered lists.

Different Types of Unordered Lists
This example demonstrates different types of unordered lists.

Nested List
This example demonstrates how to nest lists.

Nested List 2
This example demonstrates more complex nested lists.

Custom List Item
This example demonstrates a definition list.


HTML List Tag

Tag Description
<ol> Definition Ordered List
<ul> Definition Unordered List
<li> Definition List Item
<dl> Definition List
<dt> Custom List Item
<dd> Definition Description of Custom List Item
Other Extensions