HTML nested lists ol and ul tags

Updated on 13 Feb 2012,
Published on 11 Jul 2008

HTML list tags such as ol and ul can be used nested within each other to display some hierarchal composition of web page content with ordered as well as unordered list of points. You can create a nested unordered HTML ul list with bullets inside the ordered HTML ol list. You can place the code assembly of ul tag along with its list items enclosed on HTML li tags inside the list item HTML li tag of outer HTML ol tag.

HTML Examples:

You can see the live samples and examples of HTML Basic tags from the following links:

Example of nested HTML lists ol and ul tags

<ol type="1">
    <li>Main ordered List item 1</li>
    <li>Below is an example of HTML nested unordered list with bullets
        <ul type="disc">
            <li>nested list item 1</li>
            <li>nested list item 2</li>
            <li>Sub nested ordered list
                <ol type="a">
                    <li>sub nested list item 1</li>
                    <li>sub nested list item 2</li>
                </ol>
            </li>
        </ul>
    </li>
</ol>

Output:

You can see the output of above discussed sample code from the following link:

HTML Nested OL and UL List Tags

Continue to next tutorial: HTML Anchor a Tag Links to learn how to create hyperlinked text on HTML pages.

Previous Tutorial

Next Tutorial