HTML Cheat Sheet

Lists

Overview

Lists are exactly what you imagine; elements in succession! HTML has a few different kinds of lists, we are only concerned with ordered and unordered lists, which you'll read about in a second!

We use three different tags to create list type. Each list type uses two tags, the parent tag, which goes around the whole list and says what list type it is, and then a tag for each individual list item.

Unordered Lists

HTML

<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ul>

RESULT

  • Item 1
  • Item 2
  • Item 3

Unordered lists are just bullet points. As you can see above we specify unordered list with the ul tag. Then inside our ul tag is multiple list item, li tags. Each dot point corresponds to a different li.

Ordered Lists

HTML

<ol>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 3</li>
</ol>

RESULT

  1. Item 1
  2. Item 2
  3. Item 3

Ordered lists are very similar to ordered lists except that they are numbered in some way. We specify an ordered list with the ol tag and once again we have list items inside for each number.