Exercise 2 Demo: Part C : Definition Lists
Definition Lists were originally created for lists featuring vocabulary words and their definitions, hence its name.
Definition List Tags
The Definition List requires a pair of tags <dl>
and </dl>
.
First open a Definition List <dl>
Then enclose a Definition Term inside the <dt> </dt>
tags.
Open a Definition Description <dd>
, put the definition of the term, and close the Definition Description tag </dd>
You can have as many terms and definitions as you want.
When you are done, close the Definition List </dl>
Your HTML will look like this:
Types of Chocolate
<dl>
<dt>
White Chocolate</dt>
<dd>
Chocolate made with cocoa butter, sugar and milk. It has no cocoa solids and is therefore white.</dd>
<dt>
Milk Chocolate</dt>
<dd>
A sweet chocolate with 10-20% cocoa solids and 12% milk solids.</dd>
<dt>
Dark Chocolate</dt>
<dd>
Sweetened chocolate with a high content of cocoa solids and little milk.</dd>
<dt>
Semi-Sweet Chocolate</dt>
<dd>
Classic dark baking chocolate with 40-62% cocoa solids.</dd>
<dt>
Bittersweet Chocolate</dt>
<dd>
Good bittersweet chocolate contains 60-85% cocoa solids. Has a rich, intense, bitter chocolate flavor.</dd>
</dl>
On your web page it would look like this:
Types of Chocolate
- White Chocolate
- Chocolate made with cocoa butter, sugar and milk. It has no cocoa solids and is therefore white.
- Milk Chocolate
- A sweet chocolate with 10-20% cocoa solids and 12% milk solids.
- Dark Chocolate
- Sweetened chocolate with a high content of cocoa solids and little milk.
- Semi-Sweet Chocolate
- Classic dark baking chocolate with 40-62% cocoa solids.
- Bittersweet Chocolate
- Good bittersweet chocolate contains 60-85% cocoa solids. Has a rich, intense, bitter chocolate flavor.
Go to Part D of Demo 2.