HTML Unordered List

When you want to group related items but their order doesn’t matter, an unordered list is the perfect choice. Instead of using numbers unordered lists rely on visual markers- like bullets points- to present items in a clean and easy-to-read format.

What is an Unordered List?

An unordered list organizes items without any sequence. Each item is equally important, and no specific order is implied. HTML displays these lists using bullets (•) by default, but this can be changed.

How to Create an Unordered List

To define an unordered list, HTML uses the <ul> tag (short for unordered list). Each item inside the list is wrapped within an <li> tag (list item).

				
					<ul>
  <li>HTML</li>
  <li>CSS</li>
  <li>JavaScript</li>
</ul>

This creates a bullet-point list with the item: HTML, CSS, and JavaScript.

Customizing Bullet Styles

HTML allows you to customize the bullet symbol using the type attribute inside the <ul> tag. Through modern practice often uses CSS for styling, you can still use this attribute for basic customization.

You can choose from three built-in bullet styles:

Disc (•)-default
Square (▪)
Circle (○)

				
					<ul type="square">
  <li>Notebook</li>
  <li>Marker</li>
</ul>

This list displays square bullets instead of the default round ones.

Conclusion

Unordered lists are useful when the order of items doesn’t matter, such as listing features, ingredients, or categories. With simple syntax and the ability to customize bullet styles, unordered lists keep content organized and visually appealing.

In the next lesson, you’ll explore ordered lists, where item order does matter.