这一节我们讨论的是定义列表。定义列表比有序和无序列表具有更多的特性。
定义列表包含的是“dt”元素,不像有序和无序列表包含的是“li”元素
“dt”元素代表的是“definition terms”定义项,接下来的是“dd”元素,表示的是"definition descriptions"定义描述。
虽然”dd“元素是跟在”dt“后面的元素,但是不必一个”dt“元素跟着一个”dd“元素,可以多个。
比如说,如果这个有一个词有相同的含义,他可能是一个"dt"跟着一个”dd“元素。如果你有多个词表示多个不同的事情,这可能一个”dt“元素之后跟着多个”dd“元素。
dl 列表中有较为强烈的“描述”、“解释”、“补充”意义。 dt 和 dd 有明显的逻辑关系,dd 从属于 dt,dd 中的内容是对 dt 的“描述”、“解释”、“补充”。另外,dd 之间虽然是平行关系,但是其描述的内容是多角度的,不同于单纯的 li。
代码示例如下:
<h1>BESTSG- Definition List</h1>
<dl>
<dt>HTML</dt>
<dd>Abbreviation for HyperText Markup Language - a language used to make web pages.</dd>
<dt>Dog</dt>
<dd>Any carnivorous animal belonging to the family Canidae.</dd>
<dd>The domesticated sub-species of the family Canidae, Canis lupus familiaris.</dd>
<dt>Moo juice</dt>
<dt>Cat beer</dt>
<dt>Milk</dt>
<dd>A white liquid produced by cows and used for human consumption.</dd>
<dt>JavaScript ready to learn</dt>
<dd>CC:xxx</dd>
<dd>ISBN:xxx</dd>
<dd>Price:xxx</dd>
</dl>
那么页面将显示如下:
Some random glossary thing
-
HTML
- Abbreviation for HyperText Markup Language - a language used to make web pages. Dog
- Any carnivorous animal belonging to the family Canidae.
- The domesticated sub-species of the family Canidae, Canis lupus familiaris. Moo juice Cat beer Milk
- A white liquid produced by cows and used for human consumption. JavaScript ready to learn
- CC:xxx
- ISBN:xxx
- Price:xxx