|
Definition Lists
<dl> opens a definition list
<dt> precedes each defined term
<dd> precedes each definition
</dl> closes the definition list
For those who actually need to define
some terms, the definition list creates a readable list with staggered margins. And those who want the margins - but don't really need a list - can easily use the tag for their own purposes.
All definition lists begin
with the <dl> tag, and end with </dl>. But unlike their numbered and unnumbered partners - which use the <li> tag to set off list items - the definition list is punctuated with the <dt> and <dd>
tags, which differentiate between the terms (<dt>) and their definitions (<dd>)
The HTML for a simple list would go something like this:
<dl>
<dt>Reflections
<dd><dd>I've learned SO much about creating my own homepage already!
There is so much important and usefull information. It all follows order so easily. Thought, Text, Code and Graphics. The proper use of graphs and links aren't such a foreign language to me anymore. I will do my best to always remember to code properly, this is the most important rule!
<dt>HTML Coding
<dd>The most important thing to use properly when creating a homepage.
</dl>
And would look like this:
Reflections
I've learned SO much about creating my own homepage already!
There is so much important and usefull information. It all follows order so easily. Thought, Text, Code and Graphics. The proper use of graphs and links aren't such a foreign language to me anymore. I will do my best to always remember to code properly, this is the most important rule!
HTML Coding
The most important thing to use properly when creating a homepage.
So that's why it's called a definition list. But, in truth, the <dl> tag is only rarely used like this. More often, you'll spot it indenting text, staggering paragraphs, and generally pushing text
around. Take this example:
<dl>
<dd>I am really nervous about designing this webpage.<br>
<br>
<dl><dl><dl><dd>And who can blame me?<br>
<br>
</dl></dl>
<dd>It's going to be displayed publicly for ALL to see!<br>
<br>
</dl>
<dd>But, this is one challenge that I'm going to make the best of!
</dl>
Which displays like this:
- I am really nervous about designing this webpage.
- And who can blame me?
- It's going to be displayed publicly for ALL to see!
- But, this is one challenge that I'm going to make the best of!
Note that several <dl>s were combined - pushing text farther to the right, and pulling it back in. And line breaks - the
<br> tag - help space out the text. Just remember to finish what you start: Every <dl> must be closed with a corresponding </dl>.
Return to Help Index
|
|
