Guide to Creating Ordered Lists

HTML supports unnumbered, numbered, and definition lists. You can nest lists too, but use this feature sparingly because too many nested items can get difficult to follow.

How to Creat Bullet Point List - Un-numbered List

To make an unnumbered, bulleted list:

1. Atart with an opening list <ul> (for unnumbered list) tag.
2. Enter the <li> (list item) tag followed by the individual item; no closing </li> tag is needed.
3. End the entire list with a closing list </ul> tag.

Below is a sample three-item list:

    <ul>
    <li> apples
    <li> bananas
    <li> grapefruit
    </ul>

The output is:

• apples
• bananas
• grapefruit

The <li> items can contain multiple paragraphs. Indicate the paragraphs with the <p> paragraph tags.

Numbered Lists

A numbered list (also called an ordered list, from which the tag name derives) is identical to an unnumbered list, except it uses <ol> instead of <ul>. The items are tagged using the same <li> tag. The following HTML code:

    <ol>
    <li> oranges
    <li> peaches
    <li> grapes
    </ol>

Produces this formatted output:

1. oranges
2. peaches
3. grapes

Nested Lists

Here is a sample nested list:

    <ul>
    <li> A few New England states:
        <ul>
        <li> Vermont
        <li> New Hampshire
        <li> Maine
        </ul>
    <li> Two Midwestern states:
        <ul>
        <li> Michigan
        <li> Indiana
        </ul>
    </ul>

The nested list is displayed as:

• A few New England states:
  • Vermont
  • New Hampshire
  • Maine
• Two Midwestern states:
  • Michigan
  • Indiana