HTML - <li> Tag



Introduction to <li> Tag

The HTML <li> tag is used to define the list items within the list. It is the fundamental part for creating both ordered (<ol>) and unordered (<ul>) lists. It helps to organize the content into a structured format, making it easier to read and understand. The each <li> represents an individual items, which can contains text, links oe other HTML elements.

The items in the ordered list (<ol>) display items in a numbered sequence, while the unordered list (<ul>) uses bullets or other markers.

Syntax

Following is the syntax of HTML <li> tag −

<li> item </li>

Attributes

HTML li tag supports Global and Event attributes of HTML. Accept a specific attribute as well which are listed below.

Attribute Value Description
value number Specifies the start value of a list item.

Example : Creating Ordered List

Let's look at the following example, where we are going to create an ordered list and use the <li> tag within the ordered list.

<!DOCTYPE html>
<html lang="en">
<head>
   <title>HTML li Tag</title>
</head>
<body>
   <ol>
      <li>HTML</li>
      <li>CSS</li>
      <li>JavaScript</li>
   </ol>
</body>
</html>

Example : Creating Unordered List

Considering the another scenario, where we are going to create an unordered list and use the <li> tag with the unordered list.

<!DOCTYPE html>
<html lang="en">
<head>
   <title>HTML li Tag</title>
</head>
<body>
   <ul>
      <li>HTML</li>
      <li>CSS</li>
      <li>JavaScript</li>
   </ul>
</body>
</html>

Example : Using value Attribute

In the following example, we are going to use the value attribute along with the <li> tag.

<!DOCTYPE html>
<html lang="en">
<head>
   <title>HTML li Tag</title>
</head>
<body>
   <ol>
      <li value="3">HTML</li>
      <li>CSS</li>
      <li>JavaScript</li>
   </ol>
</body>
</html>

Supported Browsers

Tag Chrome Edge Firefox Safari Opera
li Yes Yes Yes Yes Yes
html_tags_reference.htm
Advertisements