HTML ol tag and element

Last update on August 19 2022 21:50:38 (UTC/GMT +8 hours)

1. HTML ol (ordered list) element is used to create an ordered list of items (information) in an HTML page.

2. Items included in an ordered list have a numbering.

3. An item appears in order of significance in an ordered list.

4. By default, items in an ordered list are preceded by numbers (1,2,3.....).

Syntax

 
 <ol>

<li>List item one</li> 

<li>List item two </li> 

..................................

</ol>

Whether both start and end tags are required

Yes.

Can contain

HTML ol element can contain one or more li elements.

Can reside within

HTML ol element can reside within APPLET, BLOCKQUOTE, BODY, BUTTON, CENTER, DD, DEL, DIV, FIELDSET, FORM, IFRAME, INS, LI, MAP, NOFRAMES, NOSCRIPT, OBJECT, TD, TH.

Attributes

Attributes specific to this element

type : Determines the form of the bullet which precedes the list item placed within an ordered list. This attribute is deprecated.

Value	Description
1	Arabic numbers (1, 2, 3,...)
a	Lower alpha (a, b, c,.....)
A	Upper alpha (A, B, C, ...)
i	Lower roman (i, ii, iii, ...)
I	Upper roman (I, II, III, ...)

compact: If set, this attribute hints the browser (or any other user agent) to display the list in a compact way. This is a boolean attribute. This attribute is deprecated.

start: Specifies the starting number of list items. The default is 1. For example, if start="5", numbering starts with 5. For lower Romans, if start="3", starting number is iii. This attribute can be used with any value of type attribute.

Identifiers

id, class.

language information and text direction

lang, dir.

Title

Title.

Style

Style.

Events

onclick, ondblclick, onmousedown, onmouseup, onmouseover, onmousemove, onmouseout, onkeypress, onkeydown, onkeyup.

Supported doctypes

HTML 4.01 Strict, HTML 4.01 Transitional, and HTML 4.01 Frameset.

Example of using HTML ol element

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>html ol tag example</title>
</head>
<body>
<ol>
<li>Welcome speech. </li>
<li>Lecture on HTML 5.</li>
<li>Lecture on CSS 3.</li>
<li>Lecture on Wordpress.</li>
<li>Launch break.</li>
<li>Lecture on using NOSQL.</li>
<li>Lecture on DRUPAL 7.</li>
</ol>
</body>
</html>

Result

View this example in a separate browser window

HTML ol tag example.

Pictorial presentation

Previous: HTML ul tag and element
Next: HTML li tag and element