<ul>

<ul> represents a list whose sequence is not essential to its meaning, such as ingredients or equipment. It usually displays bullet markers, but the meaning comes from the list structure.

A collection of supplies

Each supply is a separate item. Reordering them does not change the list’s meaning.

<p>Bring these supplies:</p>
<ul>
  <li>A laptop</li>
  <li>A notebook</li>
  <li>A pen</li>
</ul>

li {
  margin-block: 0.4rem;
}

Content and styling

Ul’s direct children are li items and permitted script-supporting elements. Put a nested list inside the item it elaborates. Do not put arbitrary paragraphs directly among the items; put them inside a li.

Use CSS list-style for marker appearance; the HTML type and compact attributes are obsolete. If you remove markers for a navigation design, verify list exposure in the browsers and assistive technology you support. Safari may stop exposing some markerless lists unless their context or an explicit list role restores it.

Exercise and alternatives

Change list-style-type to square, then reorder the items. The collection’s meaning remains. Use ol for steps that depend on sequence, and dl for names paired with descriptions or values.

Sources and browser support

MDN: ul describes the syntax and links to the specification and compatibility data. Check individual values in that table when supporting older browsers.