HTML List Element

If we compose or develop a web page, we often need to add a bulleted or numbered list to the text. This can be done with HTML lists. In this case, the lists are not in a specific order.

HTML List Elements are of two types

1. Ordered List
2. Unordered List

ORDERED LISTS

An ordered list is fairly similar to an unordered list, except we will want to use the <ol> tag to declare the list. List items are still wrapped in a <li> tag. The list items will be numbered rather than the bulleted items we saw previously.

From the CODE below, you’d notice I listed Ocean types.’ using the <ol> tag, which means ordered list, and they are orderly numbered in format: 

UNORDERED LIST

Unordered lists can be used to show things like a list of things to do or a list of things to buy.

We must use the <ul> tag with nested <li> tags for the list of items to do this. The <ul> tag in the code means “unordered lists”; It indicates your list items be rendered in an unorderly manner; by default, the bullet icon is used

Changing the bullet type from disc to square using the type attributes

The TYPE and START type attributes allow us to change the style of either the
bullets for unordered lists or the numbering scheme for ordered lists.

Unordered list-type values include:

• circle
• disc
• square.

Ordered list-type values can be used to change the numbering scheme and include the following:

• 1: Default numeric scheme
• I: Upper-case Roman numerals
• i: Lower-case Roman numerals
• A: Upper-case Alphabet
• a: Lower-case Alphabet

Ordered lists have an additional start attribute that can be used to start the numbering at a value other than the default of 1.

If you look at the input (start =“5”) is me telling the code to start listing from number 5, I won’t include that if I want to start from 1

What if you want to start the numbering from 5?

You can try

type="1" start="5"

Important HTML List Tags