HTML lists

Lists in HTML are a powerful way to organize and structure content on a web page. By using the appropriate list type and nesting lists within each other, web developers can create complex and highly structured documents that are easy for users to read and navigate.

There are two types of lists in HTML:

Ordered list (<ol>)
Unordered list (<ul>)

Each item in the list is represented by a <li> tag. Here's an example:

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

Instructions

Below our <h3> with the text Here is our top list:, let's create an ordered list with 3 empty items.

To create an ordered list, we should use the <span classname='highlighted-code'><ol></span> tag.

For example, to create an <span classname='highlighted-code'><ol></span> with 2 items, write the following:

<ol>
    <li></li>
    <li></li>
</ol>

Inside the first list item add a <h4> title with the text: Greece.

Below the title (also inside the first list item), let's add a paragraph that says:

1Greece, officially the Hellenic Republic, is a country in Southeast Europe. It is situated on the southern tip of the Balkan Peninsula, and is located at the crossroads of Europe, Asia, and Africa.

Inside the second list item, let's add a <h4> with the text Italy and a paragraph below with the text:

1Italy, officially the Italian Republic or the Republic of Italy, is a country in Southern and Western Europe.

And last but not least, inside the third list item, let's add a <h4> with the text Spain and a paragraph below with the text:

1Spain, or the Kingdom of Spain, is a country primarily located in southwestern Europe with parts of territory in the Atlantic Ocean and across the Mediterranean Sea.

Already have an account?

Course content