Fairfield Institute of Management and Technology
HTML –Ordered List
Subject Name: E -Commerce
Subject Code: 106
Submitted to: Submitted by:
Mr. Prashant Vats Name: Vineet Gola
Enrollment no: 08790101720
Course: BBA(GENERAL)
Semester/Section: 2
Topic:
HTML –Ordered List
Table of Content
Contents Page No.
Introduction to HTML
2-4
HTML Ordered List
5
HTML Ordered List
Example
6-8
Start Attribute
9
Reversed Attribute
10
Conclusion
11
Bibliography
12
Introduction to HTML
HTML is an acronym which stands for Hyper Text Markup
Language which is used for creating web pages and web applications.
Let's see what is meant by Hypertext Markup Language, and Web page.
Hyper Text: Hypertext simply means "Text within Text." A text has a
link within it, is a hypertext. Whenever you click on a link which brings
you to a new webpage, you have clicked on a hypertext. Hypertext is a
way to link two or more web pages (HTML documents) with each other.
M a r k u p l an g u a g e : A m a r k u p l a n g u a g e i s a c o m p u t e r l a n g u a g e t h a t i s
used to apply layout and formatting conventions to a text document.
Markup language makes text more interactive and dynamic. It can turn
text into images, tables, links, etc.
Web Page: A web page is a document which is commonly written in
HTML and translated by a web browser. A web page can be identified by
entering an URL. A Web page can be of the static or dynamic type. With
the help of HTML only, we can create static web pages .
Hence, HTML is a markup language which is used for creating attractive
web pages with the help of styling, and which looks in a nice format on a
web browser. An HTML document is made of many HTML tags and each
HTML tag contains different content.
Let's see a simple example of HTML.
Description of HTML Example
<!DOCTYPE>: It defines the document type or it instruct the browser
about the version of HTML.
<html > : This tag informs the browser that it is an HTML document.
Text between html tag describes the web document. It is a container for
all other elements of HTML except <!DOCTYPE>
<head> : It should be the first element inside the <html> element, which
contains the metadata(information about the document). It must be closed
before the body tag opens.
<title> : As its name suggested, it is used to add title of that HTML page
which appears at the top of the browser window. It must be placed inside
the head tag and should close immediately. (Optional)
< b o d y> : T e x t b e t w e e n b o d y t a g d e s c r i b e s t h e b o d y c o n t e n t o f t h e p a g e
that is visible to the end user. This tag contains the main content of the
HTML document.
<h1> : Text between <h1> tag describes the first level heading of the
webpage.
<p> : Text between <p> tag describes the paragraph of the webpage.
HTML Ordered List
HTML Ordered List or Numbered List displays elements in numbered format. The HTML ol
tag is used for ordered list. We can use ordered list to represent items either in numerical order
format or alphabetical order format, or any format where an order is emphasized. There can be
different types of numbered list:
o Numeric Number (1, 2, 3)
o Capital Roman Number (I II III)
o Small Roman Number (i ii iii)
o Capital Alphabet (A B C)
o Small Alphabet (a b c)
To represent different ordered lists, there are 5 types of attributes in <ol> tag.
HTML Ordered List Example
Let's see the example of HTML ordered list that displays 4 topics in
numbered list. Here we are not defining type="1" because it is the default
type.
Output:
1. HTML
2. Java
3. JavaScript
4. SQL
ol type="I"
Let's see the example to display list in roman number uppercase.
Output:
I. HTML
II. Java
III. JavaScript
IV. SQL
ol type="i"
Let's see the example to display list in roman number lowercase.
Output:
i. HTML
ii. Java
iii. JavaScript
iv. SQL
ol type="A"
Let's see the example to display list in alphabet uppercase.
Output:
A. HTML
B. Java
C. JavaScript
D. SQL
ol type="a"
Let's see the example to display list in alphabet lowercase.
Output:
a. HTML
b. Java
c. JavaScript
d. SQL
Start attribute
The start attribute is used with ol tag to specify from where to start the
list items.
<ol type="1" start="5"> : It will show numeric values starting with "5".
<ol type="A" start="5"> : It will show capital alphabets starting with
"E".
<ol type="a" start="5"> : It will show lower case alphabets starting with
"e".
<ol type="I" start="5"> : It will show Roman upper case value starting
with "V".
<ol type="i" start="5"> : It will show Roman lower case value starting
with "v".
Output:
v. HTML
vi. Java
vii. JavaScript
viii. SQL
Reversed Attribute
This is a Boolean attribute of HTML <ol> tag, and it is new in HTML5
version. If you use the reversed attribute with
tag then it will numbered the list in descending order (7, 6, 5,
4......1).
Output:
4. HTML
3. Java
2. JavaScript
1. SQL
CONCLUSION
Therefore, I have summarized what the ordered list has
done to the end, and it is almost supported in all browsers.
Certainly, you can create any numbers of lists in the HTML
tag element; in this article, we just focused on selected
examples to understand the basic implementation. Thus,
learning this topic might not the toughest job, as the
<ol><li> tag used here is very simple to remember.
BIBLIOGRAPHY
Website: www.w3schools.com
www.tutorialspoint.com
www.javatpoint.com
www.educba.com
en.wikipedia.org