HTML Lists

HTML lists are a neat little feature that help you easily create tidy, formatted lists, using bullet points, numbers or even your own preferred symbol!

There are 3 different types of lists, all of which share the same fundamental structure.

List Opening Tag: Either <ol> <ul> or <dl>
List Item: This is the same for unordered and ordered list types <li> </li> and slightly different for definition lists which we will describe in detail on the definition lists page
List Closing Tag: To match the opening tag, either: </ol> </ul> or </dl>

Simple right?

Taking it one step further, you can create nesting lists.

Nesting lists are essentially lists within lists, sort of like in Microsoft Word, when list items begin to have sub items.

We’ll cover nesting lists while we go through the specific list examples.

The 3 different list types are:

1. Unordered Lists

These are structured lists using bullet points. You do not need to put the bullet points in, the list does this automatically.

Example:

When going camping, things you may want to bring include:

  • Tent
  • Firewood
  • Water
  • Food in packages

Learn more about unordered lists.

 

2. Ordered Lists

These are structured numbered lists. You do not need to add the numbers in, the list does this automatically.

Example:

There are 3 different types of lists:

  1. Unordered Lists
  2. Ordered Lists
  3. Definition Lists

Learn more about ordered lists.

 

3. Definition Lists

These are used to list terms with their definitions.

Computer
Device that allows us to run applications and go on the Internet as well as use Microsoft Office
Browser
Used to visit web pages
Programming
Designing and building a computer program to complete a specified result

Learn more about definition lists.