HTML <ul> Tag
Description
The HTML <ul> element represents an unordered list of items, typically rendered as a bulleted list. Each item in the list is wrapped in an <li> (list item) element.
Unordered lists are used when the order of items does not matter — for example, a list of features, a navigation menu, or a shopping list.
CSS Display:
blockSyntax
<ul>\n <li>Item 1</li>\n <li>Item 2</li>\n <li>Item 3</li>\n</ul>Popular Attributes
| Attribute | Description |
|---|---|
| id | A unique identifier for the element. Used for CSS styling, JavaScript targeting, and anchor links. |
| class | Specifies one or more CSS class names for styling the element. |
This element also supports global HTML attributes such as class, id, style, data-*, and more.
Examples
Basic Unordered List
<ul>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ul>
A simple bulleted list of items.
Nested List
<ul>
<li>Frontend
<ul>
<li>HTML</li>
<li>CSS</li>
</ul>
</li>
<li>Backend
<ul>
<li>Node.js</li>
<li>PHP</li>
</ul>
</li>
</ul>
Lists can be nested inside each other to create hierarchical structures.
Notes
Only <li> elements should be direct children of a <ul>. If you need an ordered (numbered) list, use the <ol> element instead. You can change the bullet style with CSS list-style-type.
Related Tags
Last updated: 7th April 2026