In this section, we will learn what HTML <li> element is and how to use it.

HTML List Element: What is <li> Tag in HTML?

HTML <li> element stands for List Item and is used to create an item for a list.

Note: in HTML, we create lists via two elements: <ol> and <ul>.

So basically, the <li> element is used in either <ol> or <ul> element to create an item on the list.

HTML <li> Tag Syntax:

<li> List Item </li>

HTML <li> Tag Values

The value we set in the <li> element is the item we want that list to have (which can be another list on itself!)

Example: HTML ul li

See the Pen HTML ul li by Omid Dehghan (@odehghan) on CodePen.

The list in this example has 5 items created via five <li> elements.

HTML <li> Style

We can use CSS to change the style of <li> elements as well. In the CSS tutorials, you’ll learn more about how to style <li> elements, but for now, let’s see how we can apply CSS properties on an <li> element.

Example: styling <li> tag in HTML

See the Pen styling <li> tag in HTML by Omid Dehghan (@odehghan) on CodePen.