Which tags do you use to write the header and items of an ordered list on a Web page you use the tag to write the header and you use the tag for the items of an ordered list?

<ol>: The Ordered List element

The <ol> HTML element represents an ordered list of items — typically rendered as a numbered list.

Table of Contents Show

<ol>: The Ordered List element
HTML Ordered Lists
OL (Ordered List)
Permitted Attributes for the OL Element
Common HTML Tags
Lists Bring Order To Web Pages: Here’s The HTML Code To Create Them

Content categories	Flow content, and if the <ol> element's children include at least one <li> element, palpable content.
Permitted content	Zero or more <li>, <script> and <template> elements.
Tag omission	None, both the starting and ending tag are mandatory.
Permitted parents	Any element that accepts flow content.
Implicit ARIA role	list
Permitted ARIA roles	directory, group, listbox, menu, menubar, none, presentation, radiogroup, tablist, toolbar, tree
DOM interface	HTMLOListElement

HTML Ordered Lists

❮ Previous Next ❯

The HTML <ol> tag defines an ordered list. An ordered list can be numerical or alphabetical.

10 Lists

Contents

Introduction to lists
Unordered lists (UL), ordered lists (OL), and list items (LI)
Definition lists: the DL, DT, and DD elements
1. Visual rendering of lists
The DIR and MENU elements

OL (Ordered List)

Permitted Context: %Body.Content, %flow, %block
Content Model: Optional list header (LH), followed by one or more list items(LI)

An ordered list typically is a numbered list of items. HTML 3.0 gives you the ability to control the sequence number - to continue where the previous list left off, or to start at a particular number. The numbering style is left to associated style sheets, e.g. whether nested lists contribute to a compound item number, e.g. "3.1.5", or whether numbers are rendered as arabic, upper or lower case roman numerals or using the numbering scheme appropriate to the language context.

The opening list tag must be <OL>. It is followed by an optional list header (<LH>caption</LH>) and then by the first list item (<LI>). For example:

<OL> <LH>Meeting Agenda</LH> <LI>Minutes of the last meeting <LI>Do we need yet more meetings? <LI>Any other business </OL>

which could be rendered as:

Meening Agenda

Minutes of the last meeting
Do we need yet more meetings?
Any other business

Note: Some legacy documents may include headers or plain text before the first LI element. Implementors of HTML 3.0 user agents are advised to cater for this possibility in order to handle badly formed legacy documents.

Permitted Attributes for the OL Element

IDAn SGML identifier used as the target for hypertext links or for naming particular elements in associated style sheets. Identifiers are NAME tokens and must be unique within the scope of the current document.LANGThis is one of the ISO standard language abbreviations, e.g. "en.uk" for the variation of English spoken in the United Kingdom. It can be used by parsers to select language specific choices for quotation marks, ligatures and hypenation rules etc. The language attribute is composed from the two letter language code from ISO 639, optionally followed by a period and a two letter country code from ISO 3166.CLASSThis a space separated list of SGML NAME tokens and is used to subclass tag names. By convention, the class names are interpreted hierarchically, with the most general class on the left and the most specific on the right, where classes are separated by a period. The CLASS attribute is most commonly used to attach a different style to some element, but it is recommended that where practical class names should be picked on the basis of the element's semantics, as this will permit other uses, such as restricting search through documents by matching on element class names. The conventions for choosing class names are outside the scope of this specification.CLEARThis attribute is common to all block-like elements. When text flows around a figure or table in the margin, you sometimes want to start an element like a header, paragraph or list below the figure rather than alongside it. The CLEAR attribute allows you to move down unconditionally:

clear=leftmove down until left margin is clearclear=rightmove down until right margin is clearclear=allmove down until both margins are clear

Alternatively, you can decide to place the element alongside the figure just so long as there is enough room. The minimum width needed is specified as:

clear="40 en"move down until there is at least 40 en units freeclear="100 pixels"move down until there is at least 100 pixels free

The style sheet (or browser defaults) may provide default minimum widths for each class of block-like elements.

CONTINUEDon't restart the sequence number, i.e. continue where previous list left off, e.g. <OL CONTINUE>SEQNUMSet the starting sequence number for the first item, e.g. <OL SEQNUM=23>COMPACTThe presence of this attribute indicates the user agent should use reduced interitem spacing. In practice, there are several ways to increase the compactness of lists: reduced vertical interitem spacing, smaller font size, or even to avoid line breaks between items. This is best handled through associated style sheets and the class attribute.

Common HTML Tags

The following are some facts about HTML tags (plus a few facts about XHTML tags too):

Web pages are just plain text. You can view or edit the source code using any text editor.
"Tags" provide web browsers with instructions about the web page, such as where to display images, and how the document is structured.
Tags are always enclosed in angle brackets: < >.
Tags are comprised of elements and attributes. An element is an object on a page (such as a heading, paragraph, or image), and attributes are qualities that describe that element (such as width and height).
Tags usually travel in pairs. An opening tag begins a section of page content, and a closing tag ends it. For example, to markup a section of text as a paragraph, you would open the paragraph with an opening paragraph tag <p> and close it with a closing paragraph tag </p> (closing tags always proceed the element with a /).
A few tags are called non-container tags, because they don't contain any content - they stand alone. Examples are images and line breaks. XHTML is more strict than HTML, and requires that all open tags must be closed, even if they're not container tags. Therefore, non-container tags end in />. For example, the tag for a line break is <br />. HTML does not have this same requirement, but it's a good habit to get into in case you ever need to code in XHTML.
Tags in HTML are not case sensitive, but in XHTML all tags must be in lower case. Even when coding in HTML, you should get in the habit of writing tags in lower case.
White space is ignored by web browsers. So, if you hit the space bar multiple times within a document, only one of those spaces will actually be displayed by the browser.
Tags can be nested. For example:
<div><p>This paragraph is nested inside a division</p></div>
Note that the order of nested tags is important: The container tags surrounding any content should be symmetrical.

Lists Bring Order To Web Pages: Here’s The HTML Code To Create Them

Disclosure: Your support helps keep the site running! We earn a referral fee for some of the services we recommend on this page. Learn more

Lists are used all the time on the web. Articles, website navigation menus, and product features on e-commerce websites all make frequent use of lists – even when you can’t tell that a list is being used just by looking at the web page.

There are three types of lists you can use, and this quick guide will show you how to use each.

Contents

1 Unordered Lists
2 Ordered Lists
- 2.1 Changing Numbering
  - 2.1.1 Creating a Countdown List
  - 2.1.2 Starting a List on a Specific Number
  - 2.1.3 Changing the Numbering Style
3 Description Lists
4 Nested Lists
5 Using Lists for Menus
6 Styling Lists
7 Closing Thoughts
8 Related Elements