HTML Unordered Lists Tutorial

In this section, we will learn how we can create an unordered list in an HTML document.

Unordered Lists in HTML

Unordered lists are those that each item in the list typically presented with a bullet point on its left side. Basically, unordered lists don’t have any number associated with their items and so we can’t tell items based on their numbers!

In HTML, in order to create an unordered list, we use an HTML element called <ul> which stands for unordered list.

The body of this element is the place where we can add items and each of those will be part of the final list.

Now let’s move on and see how we can create such a list using the <ul> element.

HTML <ul> Element Syntax:


<li> item</li>

<li> item</li>


Note that we use the HTML <li> element, which stands for List Item, to add new items to a <ul> element. So the content that we put inside each <li> element will be considered as an item on the final unordered list.

Example: bulleted list in HTML

See the Pen bulleted list in HTML by Omid Dehghan (@odchan1) on CodePen.

In this example, the list contains 3 items, and they are presented using a bullet point for each item.

Note: the bullet point you see for each item is editable and we can use other shapes here! In short, this is done using CSS list-style-type property, which you can learn about it in the CSS section.


Top Technologies