网页制作中的CSS+DIV:dl,dt,dd分别表示什么意思?

html-css018

网页制作中的CSS+DIV:dl,dt,dd分别表示什么意思?,第1张

<dl>标记定义了一个定义列表,定义列表中的条目是通过使用<dt>标记(“definition

title”,定义标题)和<dd>标记(“definition

description”,定义描述)创建的。<dt>给出了术语名,<dd>标记给出了术语的定义。

也就是说<dt>用来创建列表中的上层项目,<dd>用来创建列表中最下层项目,<dt>和<dd>都必须放在<dl><

/dl>标志对之间。

<dl>

<dt>我们在做列表标题</dt>

<dd>我们在做列表</dd>

<dd>我们在做列表</dd>

<dd>我们在做列表</dd>

<dd>我们在做列表</dd>

</dl>

dl dt dd的结构和table是不一样的。在一个表格元素中,table包含tr,tr包含td;在一个dl结构中,dl包含dt和dd,但dt和dd不是相互包含的关系,而是同级关系,就像下面这样:

<dl>

<dt></dt>

<dd></dd>

<dd></dd>

<dt></dt>

<dd></dd>

<dd></dd>

<dl>

dl标签的确切意思是“一个自定义的列表”,dt是列表中的项目名称,dd是列表项目的描述。所以在一个标准的DL列表里面不存在dt和dd相互包含的情况,自然也不能做出等价于table的多列表格的效果。但是在形态上与表格相似或者相同是可以的,这也不是dl列表的专利,div、ul这些也能做到,不是什么奇怪的事情。

不过话说回来,如果硬要让dt包含dd,似乎也未尝不可,例如像下面这样

<dl>

<dt>

<dd></dd>

<dd></dd>

</dt>

<dt>

<dd></dd>

<dd></dd>

</dt>

<dl>

这样就把table的结构给模拟出来了,每个DT相当于表格中的一行或者一列,每个DD相当于一个单元格,然后定义DT或者DD 的宽高,同时加一句display:inline-block就可以了,似乎这样在道理上也是可行的,不过不符合规范罢了。