Unordered List in HTML
HTML

Unordered List in HTML

Editorial Team
Editorial Team

In HTML, an unordered list is used to group related items. An unordered list can be created by using the <ul> tag. By default, unordered list items are marked with a bullet symbol.

Example

<!DOCTYPE html>
<html>
<head>
    <title>Unodered List<title>
</head>
<body>
    <ul>
        <li>Apple</li>
        <li>Orange</li>
        <li>Grapes</li>
    </ul>  
</body>
</html>

Output

  • Apple
  • Orange
  • Grapes

Styling an unordered list

The list-style-type attribute of CSS can be used to apply different types of list item markers to the list.

Example – Disc

<ul style="list-style-type:disc">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Example – Circle

<ul style="list-style-type:circle">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Example – Square

<ul style="list-style-type:square">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Example – None

<ul style="list-style-type:none">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
</ul>

Other HTML List tags