0% found this document useful (0 votes)
56 views8 pages

Web Design (HTML) : Objective

The document discusses different types of lists in HTML - unordered lists, ordered lists, and definition lists. It provides examples of how to create lists using <ul>, <ol>, and <dl> tags and how to specify bullet styles, numbering, and term/definition pairs. The document also includes an example integrating different list types to organize information about movies and university departments.

Uploaded by

mohammmad
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
56 views8 pages

Web Design (HTML) : Objective

The document discusses different types of lists in HTML - unordered lists, ordered lists, and definition lists. It provides examples of how to create lists using <ul>, <ol>, and <dl> tags and how to specify bullet styles, numbering, and term/definition pairs. The document also includes an example integrating different list types to organize information about movies and university departments.

Uploaded by

mohammmad
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PPTX, PDF, TXT or read online on Scribd
You are on page 1/ 8

Web Design (HTML)

Objective
You will learn :
• Lists .
• Unordered List
• Ordered List.
• Definition list
• Use Adobe Dreamweaver CS6 Editor
Unordered List

 HTML offers web authors three ways for specifying lists of information. All
lists must contain one or more list elements. Lists may contain :
 <ul> − An unordered list. This will list items using plain bullets.
 <ol> − An ordered list. This will use different schemes of numbers to list
your items.
 <dl> − A definition list. This arranges your items in the same way as they
are arranged in a dictionary.
 Tags are <ul> </ul> <ol></ol> <li></li>
<dl> </dl> <dt></dt><dd></dd>
Unordered List
  type attribute for <ul> tag to specify the type of bullet you like, We have
“circle”, “square” , “disc”

<ul> <ul type=“circle”>


 Example a
<li>Apple</li> <li>Apple</li>
<li>Orange</li> <li>Orange</li>
<li>Potato</li> <li>Potato</li>
<li>Radish</li> <li>Radish</li>
</ul> </ul>

The output is: (default)


The output of Circle type
•Apple
oApple
•Orange
oOrange
•Potato
oPotato
•Radish
oRadish
Ordered List
 type attribute for <ol> tag to specify the type of numbering you like. By
default, it is a number. Following are the possible options ( 1, I, i, A, a)
 You can use start attribute for <ol> tag to specify the starting point of
numbering you need, such as start=“4”
 Example
<ol> <ol type=“I”>
<li>Apple</li> <li>Apple</li>
<li>Orange</li> <li>Orange</li>
<li>Potato</li> <li>Potato</li>
<li>Radish</li> <li>Radish</li>
</ol> </ol>

The output is: (default) The output using I type


1.Apple I.Beetroot
2.Orange II.Ginger
3.Potato III.Potato
4.Radish IV.Radish
Definition List
 definition lists where entries are listed like in a dictionary or encyclopedia,
or glossary. Tags are <dl>, <dt> for term, <dd> for definition.
 Example
<dl>
<dt><b>HTML</b></dt>
<dd>This stands for Hyper Text Markup Language</dd>
<dt><b>HTTP</b></dt>
<dd>This stands for Hyper Text Transfer Protocol</dd>
</dl>

The output is:


HTML
This stands for Hyper Text Markup Language
HTTP
This stands for Hyper Text Transfer Protocol
Example
<body>
<h2> There are Different Kinds of Movies </h2>
<ul type="square" >
<li> Action</li>
<li> Drama </li>
<li> Comedy </li>
</ul>
<h2> There are Different Scary Movies </h2>
<ol type="A" start="3">
<li> Horror </li>
<li> Thriller</li>
<li> Mystery </li>
</ol>
<dl>
Example : CONT
<dt><b> Mystrey </b></dt>
<dd> something that is difficult or impossible to understand or explain.
</dd></dl>
<h2> University Dept. are: </h2>
<ul> <li> Information Technology Faculty </li>
<ol> <li>Software Engineering </li>
<li>Computer Science </li>
</ol>
<li> Business Faculty</li>
<ol> <li>ADMINISTRATION </li>
<li>ACCOUNTING </li>
<li> MARKETING </li>
</ol>
</ol>
</body>

You might also like