Chapter 4.2: Definition & Nested Lists
Now just like Ordered and Unordered lists and pretty much every other element in HTML the Definition list is its simplified abbreviation <dl> . Now also like all list types, this only defines what type of list it is. Only instead of using <li> for this list, we use something else. To put the title of what we're defining we make a "Definition title" or <dt> . Now to put the definition of what we're defining we put "Definition Definition" or <dd> . Of course under the title goes the definition, and the title goes under the genre. Like so...
So...
<dl>
<dt>Hello</dt>
<dd>Used as a greeting or to begin a telephone conversation.</dd>
<dt>Goodbye</dt>
<dd>Used to express good wishes when parting or at the end of a Conversation.</dd>
</dt>
Will make...
So...
<dl>
<dt>Hello</dt>
<dd>Used as a greeting or to begin a telephone conversation.</dd>
<dt>Goodbye</dt>
<dd>Used to express good wishes when parting or at the end of a Conversation.</dd>
</dt>
Will make...
- Hello
- Used as a greeting or to begin a telephone conversation.
- Goodbye
- Used to express good wishes when parting or at the end of a Conversation.
Now a nested list is an Ordered or Unordered list that does what a Definition list does and creates indents. to make a nested list we don't use <nl> in fact there is no tsg for indenting a list. Watch how it looks if you were trying to represent decimal parts:
<ul>
<li>This is part one</li>
<li>This is part one point one</li>
<li>This is part one point two</li>
<li>This is part two</li>
</ul>
<ul>
<li>This is part one</li>
<li>This is part one point one</li>
<li>This is part one point two</li>
<li>This is part two</li>
</ul>
- This is part one
- This is part one point one
- This is part one point two
- This is part two
Is that boring or what? Plus it looks more like there are four chapters instead of just two. So to fix that we simply create another list of the same kind, in this case an Unordered list <ul> then we do the same thing we did before. And it will indent itself. Watch
So...
<ul>
<li>This is part one</li>
<ul>
<li>This is part one point one</li>
<li>This is part one point two</li>
</ul>
<li>This is part two</li>
</ul>
Will make...
So...
<ul>
<li>This is part one</li>
<ul>
<li>This is part one point one</li>
<li>This is part one point two</li>
</ul>
<li>This is part two</li>
</ul>
Will make...
- This is part one
- This is part one point one
- This is part one point two
- This is part two
Pretty cool, huh?