There are two different types of lists we will look at in this tutorial. The first type is an unordered list (bullet list) which is used to list items in no particular order. A bullet list is a dot-point list but you can customise the style of the list to use squares or arrows instead of dots, for example. The second type of list is an ordered list (numbered list) which uses numbers to order items in a list.

An unordered list looks like this:

• Item 1

• Item 2

• Item 3

An ordered list looks like this:

1. Item 1

2. Item 2

3. Item 3

Unordered list items go between the <ul> and </ul> tags in the body section of your webpage. Ordered list items go between the <ol> and </ol> tags on your webpage. Each list item is surrounded by the <li> and </li> tags (you can use <li> in both unordered and ordered lists). Watch the video below and then scroll down to see the code. If you’d like to find out how to style lists with CSS code, you should check out the list styling tutorial.