Beginner's Guide to XHTML
Wednesday 22nd June 2005 - Saturday 7th January 2006
Categories: Guides, Internet, Code
Lists
In this reasonably short part, we are going to look at how to create lists, of which there are two main types: ordered and unordered. However, they both follow the same basic rules, and can be nested within each other.
An ordered list begins with the <ol> tag, while an unordered list begins with the <ul> tag. For each part of the list, we have text surrounded by the <li> tag, representing list item. For example, here is the code you would use for an ordered list:
<ol>
<li>Item 1</li>
<li>Item 2</li>
</ol>
Which creates this:
- Item 1
- Item 2
An unordered list is the same, except with a single letter change in the first and last tags:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
The end product of which is:
- Item 1
- Item 2
The final point about lists is the ability to nest them. This means that you can have a list within a list. That list still follows the same rules as an ordinary list. You can mix ordered and unordered lists. For example:
<ol>
<li>Cake
<ul>
<li>Sponge Cake</li>
<li>Chocolate Cake</li>
</ul></li>
<li>Bread
<ul>
<li>White Bread</li>
<li>Brown Bread</li>
</ul></li>
</ol>
The result is this:
- Cake
- Sponge Cake
- Chocolate Cake
- Bread
- White Bread
- Brown Bread