HTML Order List Tag
The HTML <ol>
tag is used to create ordered lists on web pages. An ordered list is a list of items that are numbered in a specific order. For example, a list of steps in a recipe or a list of items in an inventory can be presented as an ordered list.
Here’s an example of how to use the <ol>
tag:
<ol>
<li>Preheat the oven to 350 degrees Fahrenheit.</li>
<li>In a large bowl, mix together the flour, baking powder, and salt.</li>
<li>In a separate bowl, beat the eggs and sugar until light and fluffy.</li>
<li>Add the melted butter and vanilla extract to the egg mixture and stir to combine.</li>
<li>Add the wet ingredients to the dry ingredients and stir until just combined.</li>
<li>Gently fold in the chocolate chips.</li>
<li>Drop spoonfuls of the batter onto a baking sheet lined with parchment paper.</li>
<li>Bake for 12-15 minutes, or until golden brown.</li>
</ol>
In this example, the <ol>
tag wraps around a list of <li>
tags, which represent the individual items in the list. The text inside each <li>
tag is the content of the list item.
By default, ordered lists are numbered using Arabic numerals (1, 2, 3, etc.). However, the <ol>
tag has several attributes that can be used to customize the appearance of the list, including:
start
: Specifies the starting number for the list. For example,start="3"
would start the list at 3 instead of 1.type
: Specifies the type of numbering to use for the list. The most common values for this attribute are1
(Arabic numerals),A
(capital letters),a
(lowercase letters),I
(capital Roman numerals), andi
(lowercase Roman numerals).reversed
: Specifies that the list should be numbered in reverse order (e.g. 10, 9, 8, etc.).
Here’s an example of how to use these attributes:
<ol start="3" type="A" reversed>
<li>Item 3A</li>
<li>Item 3B</li>
<li>Item 3C</li>
</ol>
In this example, the list starts at 3 (start="3"
), uses capital letters for the numbering (type="A"
), and is numbered in reverse order (reversed
).
In summary, the <ol>
tag is used to create ordered lists in HTML. It can be customized using several attributes to change the numbering style, starting number, and direction of the list.