Lists in HTML

HTML list is used to group a set of related items in lists.

There are 3 types of lists.

They are

1. Ordered List

2. Unordered list

3. Description Lists

The most commonly used list types are ordered and unordered lists.

1. Ordered List:

The Ordered list in HTML can be defined using the <ol> tag, where ol stands for Ordered List.

Syntax:

<ol>
  <li><!-- --></li>
</ol>

Each list item starts with a <li> tag.

li stands for List Item.

The list items will be marked with numbers by default.

Using the type attribute in the <ol> tag we can change the type of the list item marker.

Example:

Output

The Type Attribute

type=”1” - The list items will be numbered with numbers (default)

type=”A” -The list items will be numbered with uppercase letters

type=”a” -The list items will be numbered with lowercase letters

type=”I” -The list items will be numbered with uppercase roman numbers

type=”i” -The list items will be numbered with lowercase roman numbers

Example:

Output

2. Unordered list

The unordered list in HTML can be defined using the <ul> tag, where ul stands for Unordered List.

Syntax:

<ul>
<li><!--  --></li>
</ul>

The list items will default be marked with bullets (small black circles).

Example:

Output

We can change the list item marker i.e) the bullets to other shapes.

list-style-type property is used to define the style of the list item marker.

The values are:

disc- Sets the list item marker to a bullet (default)

circle- Sets the list item marker to a circle

square- Sets the list item marker to a square

none- The list items will not be marked

Example:

Output

3. Description Lists

A description list is a list of terms, with a description of each term.

The <dl> tag defines the description list, the <dt> title defines the term (name), and the <dd> tag describes each term.

Example:

Output