HTML Lists

by UDEMIE

To make your code easier to understand and collaborate with other developers, you can include comments. Additionally, you can use comments to “comment out” lines of code without actually deleting them, which will make debugging easier. Put a <!-- tag before the code and a --> tag after the code that you wish to hide in order to add a remark in HTML. Browsers are instructed to disregard anything in between these tags.

HTML Lists Synopsis

Let’s take an example where you and a group of developers are developing a website. You should leave a note telling them to use the same color for all of the buttons right! Here’s how you can do that in HTML:

<!-- Remember to use the same color for all buttons -->
<button style="background-color: blue;">Click me!</button>

Now, let’s move on to understanding HTML Lists.

HTML – Lists (Ordered and Unordered)

Have you ever heard of the term “Bucket List” or “Wishlist”, where a person has a list of what he/she wants to do? For example, my bucket list is to:

  1. Ask Jane out.
  2. Visit an underwater hotel in Dubai.
  3. Take a selfie with Elon Musk.
  4. Visit Ettronics Website.

It is not only a bucket list, instead, we can categorize lists in HTML to organize and present content efficiently. HTML supports two types of lists: Ordered and Unordered.

Ordered Lists

Ordered lists are used to list items in a specific sequence. Each item in the list is numbered. To create an ordered list, you use the <ol> tag and list items with the <li> tag.

Example:

<ol>
    <li>Ask Jane out.</li>
    <li>Visit an underwater hotel in Dubai.</li>
    <li>Take a selfie with Elon Musk.</li>
    <li>Visit Ettronics Website.</li>
</ol>

This will display:

  1. Ask Jane out.
  2. Visit an underwater hotel in Dubai.
  3. Take a selfie with Elon Musk.
  4. Visit Ettronics Website.

Unordered Lists

Unordered lists are used to list items that do not need to be in a specific order. Each item in the list is preceded by a bullet point. To create an unordered list, you use the <ul> tag and list items with the <li> tag…

READ: What is an HTML Tag?

Read HTML Lists Online

You can use the link below to read HTML Lists Online

Read Online

Leave a Comment