0% found this document useful (0 votes)
1K views

Ordered and Unordered Lists

The document discusses ordered and unordered lists in HTML. Ordered lists use the <ol> tag and number each item. Attributes like type and start can customize the numbering. Unordered lists use the <ul> tag and bullet each item. Attributes like type can customize the bullet. Lists can be nested to further organize items.

Uploaded by

Koleen Lopez Ü
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
1K views

Ordered and Unordered Lists

The document discusses ordered and unordered lists in HTML. Ordered lists use the <ol> tag and number each item. Attributes like type and start can customize the numbering. Unordered lists use the <ul> tag and bullet each item. Attributes like type can customize the bullet. Lists can be nested to further organize items.

Uploaded by

Koleen Lopez Ü
Copyright
© © All Rights Reserved
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 21

HTML

ORDERED AND UNORDERED LISTS


Objectives
Understand ordered and unordered List
Explore nesting tags and list.
ORDERED LISTS

This is the type of the list where each item


is numbered usually starting at 1.
But can be changed using the start
attribute.
The ordered lists uses the container tag
<ol></ol>
Ordered list

Each item in this list is specified by


the empty tag:
<li>
Types of Colors
1. Primary
2. Secondary
3. Tertiary
Different types of numbering Ordered List
(Attribute = type)
1 for regural numbering (1,2,3,4, etc.)
a for lowercase alphabet (a,b,c,d, etc.)
A uppercase alphabet (A, B, C, D, etc.)
i for lowercase Roman Numeral (i, ii, iii, iv, etc.)
I for lowercase Roman Numeral (I, II, III, IV etc.)
Attributes of
<ol></ol>
Attribute Definition Value

Type Indicates the 1, a, A, I, I


type numbering
to be used in
the list.
Ex. <ol
type=A></ol>
Attributes of
<ol></ol>
Attribute Definition Value

Start Indicates the value or Any


number of the first number
item in the list.
Ex. <ol type=1
start=3></ol>
Classroom Officers
A. President
B. Vice-President
C. Treasurer
Classroom Officers part 2
iv. Secretary
v. Auditor
vi. PIO
UNORDERED LIST
This type of list that enumerates each item is not
NUMBERED but rather BULLETED and uses the
container tag:

<ul></ul>
<li>
Types of Colors
Primary
Secondary
Tertiary
Different Types of
UNORDERED LIST
Disk for round bullets
<ul type=disk>
Circle for circular bullets
<ul type=circle>
Square for square bullets
<ul type=square>
Attributes of
<ul></ul>
Attribute Definition Value

Type Indicates the type of Disc, circle,


bullet to be used in square
the list,
Ex. <ull
type=A></ol>
Colors NESTING LISTS
1. Primary
. Red
. Blue
. Yellow
2. Secondary
. Orange
. Violet
. Green
<html>
<head>
<title>Visual Guide</title>
</head>
<body>
<h3>Colors</h3>
<ol>
<li>Primary
<ul>
<li>Red
<li>Blue
<li>Tertiary
</ul>
<li> Secondary
<ul>
<li>Orange
<li>Violet
<li>Green
</ul>
</ol>
</body>
</html
Assignment
Write the code for the following outputs

I. Adobe
. Photoshop
. Flash
. Dreamweaver
II. Microsoft
. Access
. Visual Basic
. Excel

You might also like