dl,dt,dd标记在网页制作中的应用

最新推荐文章于 2021-07-08 23:15:59 发布

iteye_6551

最新推荐文章于 2021-07-08 23:15:59 发布

阅读量265

点赞数

我们在做列表的时候通常只会用到ul和li标签,至于dl,dt,dd一般都很少用到，这三个标签就是属于定义列表类的标签，先来分解一下这个列表的代码：

</dl>

看上面这段代码我们发现这里并没有出现<li>标签，而是由DL、DT、DD三个标签组成，根据外型以及之前的列表我们可以知道，DL是这个列表的一个容器，就像个箱子，不同的是这次箱子里不只有统一标准的单个小盒子了。而是出现两个不同的内容我们怎么理解这个DT与DD呢？从语义上来讲，DT是名称，是标题，而DD是解释，是内容。DT与DD都是盒子，DD只对应解释他上面的一个DT，不能越级或是向下解释。

我们在制作网页过程中用到列表时一般会使用<ul>或者<ol>标签，很少用刑<dl>标签，但是这个三个标签却有着不可忽视的作用，毕竟Web标准中要尽最大可能的使用已有的标签。它们的用途是：

< dl>< /dl>用来创建一个普通的列表,

< dt>< /dt>用来创建列表中的上层项目，

< dd>< /dd>用来创建列表中最下层项目，

< dt>< /dt>和<dd>< /dd>都必须放在< dl>< /dl>标志对之间。

有如下代码

<html>
<head>
<title>一个普通列表</title>
</head>
<body text="blue">
<dl>
<dt>中国城市</dt>
<dd>北京 </dd>
<dd>上海 </dd>
<dd>广州 </dd>
<dt>美国城市</dt>
<dd>华盛顿 </dd>
<dd>芝加哥 </dd>
<dd>纽约 </dd>
</dl>
</body>
</html>

我们可以看到，<dt></dt>中间的文字即时我们没有进行缩进它也会怎地向前靠拢，而<dd></dd>中间的内容则自动向后缩进。这在腾讯新闻评论中已经使用到了

iteye_6551

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
dl,dt,dd标记在网页制作中的应用

我们在做列表的时候通常只会用到ul和li标签,至于dl,dt,dd一般都很少用到，这三个标签就是属于定义列表类的标签，先来分解一下这个列表的代码：&lt;dl&gt;&lt;!–DefinitionList (定义列表)–&gt;&lt;dt&gt;&lt;/dt&gt;&lt;!–DefinitionTerm （定义项）–&gt;&lt;dd&gt;&lt;/dd&gt;&a
复制链接

扫一扫