HTML li Tag

The <li> tag is an HTML element used to create a list item within an ordered (<ol>) or unordered (<ul>) list. It represents an individual item or entry within a list.

Here’s an example of how the <li> tag is used within an ordered list:

<ol>
     <li>First item</li>
     <li>Second item</li>
     <li>Third item</li>
</ol>

In this example, the <ol> tag creates an ordered list, and each <li> tag represents a list item. The list items are automatically numbered by the browser, creating a numbered list.

Similarly, the <li> tag can be used within an unordered list (<ul>) to create a bulleted list:

<ul>
     <li>Red</li>
     <li>Green</li>
     <li>Blue</li>
</ul>

In this case, the <ul> tag creates an unordered list, and each <li> tag represents a list item. The list items are displayed with bullet points by default, creating a bulleted list.

The <li> tag can also be nested within other list items to create nested or hierarchical lists:

<ul>
     <li>First item</li>
     <li>Second item
          <ul>
               <li>Nested item 1</li>
               <li>Nested item 2</li>
          </ul>
     </li>
     <li>Third item</li>
</ul>

In this example, the second list item contains a nested unordered list with two nested list items.

It’s important to note that the <li> tag should always be used within an ordered (<ol>) or unordered (<ul>) list. Using the <li> tag outside of a list context is not valid HTML.

By default, the browser applies specific styling to the <li> tag, such as indentation, bullet points, or numbering. You can further customize the appearance of list items using CSS.

Overall, the <li> tag is essential for creating well-structured and semantically correct lists in HTML.