Did you find this useful?
Socialize it today.


HTML Lists

Saturday, February 18, 2012

Creating lists in HTML documents can be very useful for situations where you need to display a number of items that are related to a topic. The types that are generally used are ordered (<ol>), unordered (<ul>), and definition lists (<dl>). Menu (<menu>) and Directory (<dir>) lists were previously used, but have been since deprecated so you should not include these types in your HTML documents.

Ordered Lists

An ordered list can be numerical or alphabetical. Within the ordered list element, you use list item (<li>) elements to list each item in the ordered list. You use CSS to apply the appropriate styles to the ordered list. Here is an example.

<ol>
 <li>Item #1</li>
 <li>Item #2</li>
 <li>Item #3</li>
</ol>
  1. Item #1
  2. Item #2
  3. Item #3

Unordered Lists

An unordered list does not use numbers or letters to define the list items. Within the unordered list element, you use list item (<li>) elements to list each item in the unordered list. You use CSS to apply the appropriate styles to the unordered list. Here is an example.

<ul>
 <li>Item A</li>
 <li>Item B</li>
 <li>Item C</li>
</ul>
  • Item A
  • Item B
  • Item C

Definition Lists

A definition list is a list of items, with a description of each item. You use the <dl> element to define a definition list. You use the <dt> element to add items and you use the <dd> element to add a description to each item. Here is an example.

<dl>
 <dt>Item A</dt>
 <dd>- Red Item</dd>
 <dt>Item B</dt>
 <dd>- Blue Item</dd>
 <dt>Item C</dt>
 <dd>- Green Item</dd>
</dl>
Item A
- Red Item
Item B
- Blue Item
Item C
- Green Item

Please help us spread the word by socializing it today!

email contact us

Did you find something wrong with the information on this page? Please take a moment to report it to us so that we can continue to improve the quality of the information on this site. Click here to report an issue with this page.



Recommended Books & Training Resources

HTML CSS: The Complete Reference Creating Web Pages Simplified HTML CSS and JavaScript Editor