What is HTML Ordered List ol Tag? Complete Tutorial
HOW TO create ordered lists in html
What is the HTML Ordered List
✱ order list schemes different from number lists for your item. If you are require to put your item in numbered of list then an HTML ordered list will be used.
✱ This list is create by using <ol> tag and ends with </ol> tag.
✱ The numbering start at one and incremented by the one for each successive ordered list element
tagged with <li> tag and ends with </li>.
Following are the possible options
<ol type="1"> - Default-Case Numbers.
<ol type="I"> - Upper-Case Roman Numbers.
<ol type="i"> - Lower Case Numbers.
<ol type ="a"> - Lower case Letters.
<ok type= "A"> - Lower Case Letters.
Syntax
<ol>
<li>first item</li>
<li>second item</li>
<li> third item</li>
</ol>
HTML Ordered List <ol> list
Program
<!DOCTYPE html>
<html>
<body>
<h1> Ordered List</h1>
<ol type="1" start="1">
<li>Water</li>
<li>Food</li>
<li>Water</li>
</ol>
<ol type="A" start="5">
<li>Students</li>
<li>sanskar</li>
<li>Education</li>
</ol>
<ol type="I" start="5">
<li>Technology</li>
<li>Science</li>
<li>Maths</li>
</ol>
</body>
</html>
HTML Ordered List
Explain Program
Step 1 ]
<!Doctype html>
- <!doctype <html> always be the first line of any HTML document.
Step 2 ]
<html> and </html>
HTML is the root element.
Step 3 ]
<body> and </body>
body is the main content area.
All visible content inside the <body> tagStep 4]
<h1> ordered list </h1>
displays a main heading title ordered list
. <h1>Ordered List</h1>
- Displays
a main heading titled "Ordered List"
Step 5]
First Ordered List:(number)
<ol type="1" start="1">
<li>Water</li>
<li>Food</li>
<li>Water</li>
</ol>
- <ol> :- ordered list
- type="1" :- Numbers the list using normal digits (1, 2, 3,4,5...).
- start="1" : - Starts the list at number 1.
- List items:
Water
-
Food
-
Water
Step 6]
Second Ordered List :(uppercase letters )
<ol type="A" start="5">
<li>Students</li>
<li>sanskar</li>
<li>Education</li>
</ol>
- type="A":
Uses uppercase letters (A, B, C,D...)
- start="5":
Starts at the 5th letter, which is E.
- List
items:
- E Students
- F. sanskar
- G.
Education
Step 7]
Third Ordered List (Roman numerals):
<ol type="I" start="5">
<li>Technology</li>
<li>Science</li>
<li>Maths</li>
</ol>
- type="I": uppercase Roman numerals (I, II, III...).
- start="5" :
Starts at Roman numeral V.
- List
items:
- V.
Technology
- VI.
Science
- VII.
Maths
How to Create Ordered Lists in HTML (With Examples)
OUTPUT
OUTPUT
Related Post :-
Post a Comment