Saturday, August 2, 2008

HTML Lists



HTML supports ordered, unordered and definition lists.

Examples

An unordered list

This example demonstrates an unordered list.

An ordered list

This example demonstrates an ordered list.

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


Unordered Lists

An unordered list is a list of items. The list items are marked with bullets (typically
small black circles).

An unordered list starts with the <ul> tag. Each list item starts with the <li> tag.






<ul>

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


Here is how it looks in a browser:
  • Coffee

  • Milk

Inside a list item you can put paragraphs, line breaks, images, links, other
lists, etc.


Ordered Lists

An ordered list is also a list of items. The list items are marked with
numbers.

An ordered list starts with the <ol> tag. Each list item starts with the <li> tag.






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


Here is how it looks in a browser:
  1. Coffee

  2. Milk

Inside a list item you can put paragraphs, line breaks,
images, links, other lists, etc.


Definition Lists

A definition list is not a list of items. This is a list of terms and
explanation of the terms.

A definition list starts with the <dl> tag. Each definition-list term starts with the <dt> tag. Each
definition-list definition starts with the <dd> tag.






<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd>
<dt>Milk</dt>

<dd>White cold drink</dd>
</dl>


Here is how it looks in a browser:

Coffee
Black hot drink

Milk

White cold drink
Inside a definition-list definition (the <dd> tag) you can put paragraphs, line breaks,

images, links, other lists, etc.


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 you can nest lists.

Nested list
2


This example demonstrates a more complicated nested list.

Definition list

This example demonstrates a definition list.


List Tags










































TagDescription
<ol>Defines an ordered list
<ul>Defines an unordered list
<li>Defines a list item
<dl>Defines a definition list
<dt>Defines a definition term
<dd>Defines a definition description
<dir>Deprecated. Use <ul> instead
<menu>Deprecated. Use <ul> instead