ul element

If you don't know what an element is or how you must use it, I recommend you read the "HTML tags and attributes" tutorial that you can find in the HTML tutorials section.

Description

The ul element represents an unordered list of items that, in contrast with ordered lists (ol element), doesn't produce a different meaning if the items order is altered. The items in both, ordered and unordered lists, are represented by the li element.

The compact and type attributes of this element have been removed from the HTML5 specification because of their presentational nature. Authors should replace their functionality with style sheets declarations.

Examples

The following example shows a very basic usage of the ul element. It's easy to see how the meaning wouldn't get altered if the items' order was changed.

<p>Ingredients</p>
<ul>
  <li>2 large eggs</li>
  <li>Sea salt and black pepper</li>
  <li>A small knob of butter</li>
  <li>A handful of cheese</li>
</ul>

Ingredients

  • 2 large eggs
  • Sea salt and black pepper
  • A small knob of butter
  • A handful of cheese

Attributes

Specific attributes

compact

A boolean value indicating if the list items should be displayed in compact mode. If the attribute is present, the compact mode should be enabled.

This attribute has become obsolete in HTML5 and its use is no longer valid. Authors are encouraged to use style sheets instead.

Example

<ul compact>

type

The type of symbols to use in the markers. There are three possible case-insensitive values:

  • disc: a filled circle.
  • circle: a non-filled circle.
  • square: a non-filled square.

This attribute became obsolete in HTML5 and its use is no longer valid. Authors are encouraged to use style sheets instead.

Example

<ul type="disc">

Global attributes

For information about global attributes refer to this list of global attributes in HTML5.

Events

Global events

For information about global events refer to this list of global events in HTML5.

X

Are you looking for a place to host your next website? I can help you with that!