In the previous articles we have learned about a few basic HTML tags. One of the other basic elements in HTML is creating lists. Whether it’s a list of items in a shopping list, a list of instructions, or a procedure to be followed, lists are a great way to organize information in a readable format.
In this example, you will learn how to create two types of lists in HTML: unordered lists and ordered lists.
Unordered Lists
Unordered lists are lists with bullet points. Here’s how to create an unordered list:
- Start by opening the unordered list tag
<ul>. - For each item in the list, open the list item tag
<li>. - Type the content for each list item.
- Close the list item tag
</li>for each item. - Close the unordered list tag
</ul>when your list is completed.
Here’s what the code for an unordered list of your favorite games might look like:
<ul>
<li>Minecraft</li>
<li>Super Mario</li>
<li>Pacman</li>
</ul>
And this is what it would look like in a web browser:
Ordered Lists
Ordered lists are lists with numbers. Here is how we can create the list.
- Start by opening the ordered list tag
<ol>. - For each item in the list, open the list item tag
<li>. - Type the content for each list item.
- Close the list item tag
</li>for each item. - Close the ordered list tag
</ol>when your list is completed.
Here is a code for ordered list on steps about “How to Boil Water?”
<ol>
<li>Grab a Utensil</li>
<li>Pour some water in it</li>
<li>Turn on the Gas and let it heat over 3-5 minutes(Depending about 10)</li>
<li>Close the Lid to boil it faster</li>
<li>Enjoy! The hot water is now ready</li>
</ol>And this is what is would look like on the web browsers:
After creating a list you can now move on to learning other HTML tags that are needed in web computing. We are learning the basic requirements of HTML for the sole purpose of physical computing in the 21st Century requires interfaces. And hence we know that Web Computing is dominant in all the fields.