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

Lists: Try-It-Yourself Examples

The document discusses different types of HTML lists, including ordered lists, unordered lists, and definition lists. Ordered lists use numbers and the <ol> tag, while unordered lists use bullets and the <ul> tag. Definition lists define terms and descriptions using the <dl>, <dt>, and <dd> tags. Examples are provided of how each list type is coded in HTML and displayed in a browser.
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
36 views

Lists: Try-It-Yourself Examples

The document discusses different types of HTML lists, including ordered lists, unordered lists, and definition lists. Ordered lists use numbers and the <ol> tag, while unordered lists use bullets and the <ul> tag. Definition lists define terms and descriptions using the <dl>, <dt>, and <dd> tags. Examples are provided of how each list type is coded in HTML and displayed in a browser.
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

4/4/13

HTML Lists

HTML Lists
Previous
The most common HTML lists are ordered and unordered lists: HTML Lists An ordered list:
1. The first list item 2. The second list item 3. The third list item

Next Chapter

An unordered list:
List item List item List item

Try-It-Yourself Examples
Unordered list How to create an unordered list in an HTML document. Ordered list How to create an ordered list in an HTML document. (You can find more examples at the bottom of this page).

HTML Unordered Lists


An unordered list starts with the <ul> tag. Each list item starts with the <li> tag. The list items are marked with bullets (typically small black circles).

< u l > < l i > C o f f e e < / l i > < l i > M i l k < / l i > < / u l >
How the HTML code above looks in a browser: Coffee Milk

HTML Ordered Lists


An ordered list starts with the <ol> tag. Each list item starts with the <li> tag. The list items are marked with numbers.

< o l > < l i > C o f f e e < / l i > < l i > M i l k < / l i > < / o l >
How the HTML code above looks in a browser: 1. Coffee
w3schools.com/html/html_lists.asp 1/3

4/4/13

HTML Lists

2. Milk

HTML Definition Lists


A definition list is a list of items, with a description of each item. The <dl> tag defines a definition list. The <dl> tag is used in conjunction with <dt> (defines the item in the list) and <dd> (describes the item in the list):

< d l > < d t > C o f f e e < / d t > < d d > -b l a c kh o td r i n k < / d d > < d t > M i l k < / d t > < d d > -w h i t ec o l dd r i n k < / d d > < / d l >
How the HTML code above looks in a browser: Coffee - black hot drink Milk - white cold drink

Basic Notes - Useful Tips


Tip: Inside a list item you can put text, line breaks, images, links, other lists, etc.

More Examples
Different types of ordered lists Demonstrates different types of ordered lists. Different types of unordered lists Demonstrates different types of unordered lists. Nested list Demonstrates how you can nest lists. Nested list 2 Demonstrates a more complicated nested list. Definition list Demonstrates a definition list.

HTML List Tags


Tag <ol> <ul> <li> <dl> Description Defines an ordered list Defines an unordered list Defines a list item Defines a definition list
2/3

w3schools.com/html/html_lists.asp

4/4/13

HTML Lists

<dt> <dd>

Defines an item in a definition list Defines a description of an item in a definition list

Previous

Next Chapter

w3schools.com/html/html_lists.asp

3/3

You might also like