ul, ol, li Tags

The <ul>, <ol>, <li> tags are used to create lists on a webpage.

The <ul> tag denotes an unordered list, while the <ol> tag indicates an ordered list. The <li> tag represents an item within the list.

The <li> tag can only be used as a child element of the <ul> or <ol> tags.

<ul> Tag

<ul> stands for Unordered List, used to represent a list with no particular order of significance.

For example, below is a list that represents fruits in a refrigerator, where the order is not important.

Unordered List

<ul>
  <li>Apple</li>
  <li>Banana</li>
  <li>Cherry</li>
</ul>

<ol> Tag

<ol> stands for Ordered List, used when the order of items in the list is meaningful, such as a to-do list.

Ordered List

<ol>
  <li>Wake up: 7 AM</li>
  <li>Go to School: 8 AM</li>
  <li>Sleep: 10 PM</li>
</ol>

<li> Tag

<li> stands for List Item, used to define individual items within <ul> or <ol> elements.

List Items

<ul>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
</ul>

Follow the highlighted sections of the code and try entering them yourself.

Want to learn more?

Join CodeFriends Plus membership or enroll in a course to start your journey.

Learn moreSign In