We use lists as a preferred way to show items one after the other. Besides lists in an article’s body, they are also used in navigation menu items a lot.
The most commonly used list types are:
- unordered lists
- ordered lists
- definition lists
Unordered lists use bullet as default prefix to indicate a list’s item, while ordered list uses ordinal numbers.
Table of Contents
Unordered Lists
Items in this list type are wrapped by ul tag and follow with li before each item.
<ul> <li>Flutter</li> <li>Java</li> <li>Kotlin</li> <li>Swift</li> <li>JavaScript</li> <li>jQuery</li> <li>NodeJS</li> </ul>

Bullets can be placed using attribute type of ul tag.
<ul type="disc | circle | square">
Ordered List
Ordered list is created using ol tag as parent and li tag as an item in list. They are default to be followed by number. We can use type attribute to change it to other formats like alphabets.
<ol> <li>PHP</li> <li>Laravel</li> <li>Drupal</li> <li>WordPress</li> <li>Joomla</li> <li>CakePHP</li> <li>CodeIgniter</li> </ol>

The number can be changed to following formats
<ol type="A | a | I | i | 1">
Definition List
It is is usually used to create glossaries. It has more complex structure than the two types of lists above.
A definition list is formed with the DL tag as parent and at least one element pair DT and DD per item.
<dl> <dt>Framework</dt> <dd>Definition of framework</dd> <dt>IDE</dt> <dd>Definition of IDE</dd> </dl>