Lists allow us to group a set of related items into lists. You can write lists using <ol> and
<ul> tags. If we use <ol>, the lists will be numbered, while when using <ul>, they will
be bulleted. The <li> tags define a list item used within <ol> and <ul> lists. HTML also
supports lists that describe terms and are defined as <dl>. Such a list defines a description list,
<dt> defines a term, and the <dd> tag describes the conditions.
EXAMPLE
RESULT
HTML Lists Cheat Sheet
This table provides a quick reference for all list types, their styles, and tags.
Ordered List <ol>
Attribute
Description
Example Code
Display
type="1"
Arabic numerals (default).
<ol type="1">
1, 2, 3, 4 ...
type="A"
Uppercase letters.
<ol type="A">
A, B, C, D ...
type="a"
Lowercase letters.
<ol type="a">
a, b, c, d ...
type="I"
Uppercase Roman numerals.
<ol type="I">
I, II, III, IV ...
type="i"
Lowercase Roman numerals.
<ol type="i">
i, ii, iii, iv ...
Unordered List <ul>
CSS Property
Description
Example Code
Display
list-style: disc
Filled circle (default).
<ul style="list-style: disc">
●
list-style: circle
Empty circle.
<ul style="list-style: circle">
○
list-style: square
Filled square.
<ul style="list-style: square">
■
list-style: none
No marker (no bullet point).
<ul style="list-style: none">
(none)
Description List <dl>
Tag
Description
Example Code
<dl>
Defines a description list (container).
<dl> ... </dl>
<dt>
Defines a term/concept in a description list.
<dt>HTML</dt>
<dd>
Defines the description/explanation of a term.
<dd>Markup language</dd>
We use cookies to ensure a better user experience and website functionality.
