Ordered Lists in HTML
Learn to create numbered lists in HTML using the <ol>
and <li>
tags, perfect for steps, rankings, and sequential information.
Creating Ordered Lists
When the order of items is important, like in a recipe or a top-10 list, you use an ordered list. Let's learn how to create these numbered lists in HTML.
Syntax
The structure consists of a main <ol>
tag that wraps all the list items. Each item is then defined by its own <li>
tag, and the browser automatically numbers them.
Purpose
Ordered lists are ideal for content where the sequence is important, such as step-by-step instructions, recipes, legal clauses, or top-10 rankings.
Practice Zone
Interactive Test 1: Drag & Drop
Arrastra en el orden correspondiente.
Arrastra las opciones:
Completa el código:
Interactive Test 2: Fill in the Blanks
Rellena los huecos en cada casilla.
<ol> <li></li> <li></li> </ol>
Practice Example: Code Editor
Create an ordered list with the three steps to make a cup of tea: "Boil water", "Add tea bag", "Pour water in cup".