nesting examples

Example of list

Browser
Internet Explorer Firefox Opera
Type
Block-level

Example of nesting list.

Tips and Notes

The size of the indent can be adjusted with CSS. Please see the "Related Document" for details on CSS.

Example

Unordered list

<ul>
<li>First list item</li>
<li>Second list item</li>
<li>Third list item

<ul>
<li>Third list item 1</li>
<li>Third list item 2</li>
<li>Third list item 3</li>
</ul>

</li>
<li>Fourth list item</li>
</ul>
Output
  • First list item
  • Second list item
  • Third list item
    • Third list item 1
    • Third list item 2
    • Third list item 3
  • Fourth list item

Ordered list

<ol>
<li>First list item</li>
<li>Second list item</li>
<li>Third list item

<ol>
<li>Third list item 1</li>
<li>Third list item 2</li>
<li>Third list item 3</li>
</ol>

</li>
<li>Fourth list item</li>
</ol>
Output
  1. First list item
  2. Second list item
  3. Third list item
    1. Third list item 1
    2. Third list item 2
    3. Third list item 3
  4. Fourth list item

Ordered list and Unordered list

<ol>
<li>First list item</li>
<li>Second list item</li>
<li>Third list item

<ul>
<li>Third list item 1</li>
<li>Third list item 2</li>
<li>Third list item 3</li>
</ul>

</li>
<li>Fourth list item</li>
</ol>
Output
  1. First list item
  2. Second list item
  3. Third list item
    • Third list item 1
    • Third list item 2
    • Third list item 3
  4. Fourth list item