0% found this document useful (0 votes)
40 views

Chapter 6 Arranging Text in Lists

This document discusses different types of HTML lists and how to format them. It covers ordered lists formatted with numbers or letters, unordered lists with bullet points, and definition lists without numbers or symbols. Attributes are described for customizing list type, numbering, and bullet style. Examples are provided for each list type.

Uploaded by

Puteri Maisara
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
40 views

Chapter 6 Arranging Text in Lists

This document discusses different types of HTML lists and how to format them. It covers ordered lists formatted with numbers or letters, unordered lists with bullet points, and definition lists without numbers or symbols. Attributes are described for customizing list type, numbering, and bullet style. Examples are provided for each list type.

Uploaded by

Puteri Maisara
Copyright
© © All Rights Reserved
Available Formats
Download as PPT, PDF, TXT or read online on Scribd
You are on page 1/ 13

HTML

Chapter 6 Arranging Text in Lists

Developing a Web Site 1


Objective

 You will learn to


 format numbered lists, bulleted lists, and a
variety of other indented lists.
 see how the HTML tags for creating lists
can be used for almost any other type of
indentation you want on your Web pages.

Developing a Web Site 2


Three Types of HTML Lists

 Ordered list <OL>…</OL>


 Unordered list <UL>…</UL>
 Definition list <DL>…</DL>

Developing a Web Site 3


Ordered List
 Ordered lists are indented lists that have
numbers or letters in front of each item.
 Tag: <OL><LI><LI>…</OL>
 Attributes: type(I – uppercase roman
numerals, i – lowercase roman numerals, A –
capital letters, a – lowercase letter, 1 – ordinal
number), start(start an ordered list with any
number or letter), value(renumber the
individual points)

Developing a Web Site 4


Ordered List - continued
 Examples
 <OL>Foods
<LI>Chicken Rice
<LI>Curry Mee
<LI>Mee Goreng
</OL>
 <OL TYPE="I">Foods
<LI>Chicken Rice
<LI>Curry Mee
<LI>Mee Goreng
</OL>
Developing a Web Site 5
Ordered List - continued
 <OL TYPE="I">Foods
<LI>Chicken Rice
<LI TYPE="a">Curry Mee
<LI>Mee Goreng
</OL>
 <OL TYPE="I">Foods
<LI>Chicken Rice
<LI TYPE="a">Curry Mee
<LI>Mee Goreng
<LI value="10">Curry Fish Head
<LI>Roti Canai
</OL>

Developing a Web Site 6


Ordered List - continued
 <OL TYPE="A" start="5">Foods
<LI>Chicken Rice
<LI>Curry Mee
<LI>Mee Goreng
<LI>Curry Fish Head
<LI>Roti Canai
</OL>
 <OL start="10">Foods
<LI>Chicken Rice
<LI>Curry Mee
<LI>Mee Goreng
</OL>

Developing a Web Site 7


Unordered List

 Unordered lists are indented lists with a


special bullet symbol in front of each
item.
 Tag: <UL><LI><LI>…</UL>
 Attributes: type(disc, circle or square)

Developing a Web Site 8


Unordered List - continued
 Examples
 <UL>Drinks
<LI>Milo
<LI>Orange Juices
</UL>
 <UL TYPE="square">Drinks

<LI>Milo
<LI>Orange Juices
</UL>

Developing a Web Site 9


Unordered List - continued
 <UL TYPE="square">Drinks
<LI TYPE="disc">Milo
<LI>Orange Juices
</UL>

Developing a Web Site 10


Definition List
 Definition lists are indented lists without any
number or symbol in front of each item.
 Tag: <DL>
<DT>
<DD>
<DT>
<DD>…
</DL>

Developing a Web Site 11


 Example:
 <DL>

<DT>OOP2033
<DD>Object-oriented with C++
<DT>DWE2334
<DD>Developing a web site
</DL>

Developing a Web Site 12


Summary

 You have learned to create and combine


three basic types of HTML lists: ordered
lists, unordered lists, and definition lists.

Developing a Web Site 13

You might also like