Nested Lists

Ordered Lists and Unordered lists can have different levels, just like an outline. Each level will be indented appropriately by your web browser. Your major concern will be to verify that each list is properly terminated and the nesting order is correct.

It can start to look complicated with all of those <ol> <li> </ul> <li> tags floating around, but just try to remember the basic structure.

Here is an example of an unordered list with sublevels of other lists:

Note how the bullet marks change for different levels of the list. Now here is the HTML that created it. Notice how I color-coded the <ul> tags so you can see how they go together:

<ul>
<strong>Here Is A Nested
Unordered List
</strong>
<li>This is the first item </li>
<li>This is the second item</li>
<ul>
<li> This is the first subitem of the second item
<ul>
<li>And this is a subitem
of a subitem</li>
<li>This is the second subitem of a subitem</li>
</ul>
</li>
<li>This is the second subitem
of the second item</li>
<li>This is the third subitem of the second item</li>
</ul>
<li>This is the third item <br>
</li>
</ul>