dl dt dd认识及dl dt dd使用方法

<dl> 标签用于定义列表类型标签。

dl dt dd目录
  1. dl dt dd介绍
  2. 结构语法
  3. dl dt dd案例
  4. dl dt dd总结
一、dl dt dd认识   -   TOP

html <dl> <dt> <dd>是一组合标签，使用了dt dd最外层就必须使用dl包裹，此组合标签我们也又叫表格标签，与table表格类似组合标签，故名我们也叫dl表格（扩展阅读：table tr td、table tr th表格布局）。

<dl><dt></dt><dd></dd></dl>为常用标题+列表型标签。如没有对dl dt dd标签初始CSS样式，默认dd列表内容会一定缩进。（扩展阅读：ul li、ol li、li列表）

二、dl dt dd列表标签语法   -   TOP

<dl>
<dt>列表标题</dt>
<dd>列表内容</dd>
<dd>列表内容</dd>
...
</dl>

语法解释：
首先dt和dd是放于dl标签内，标签dt与dd处于dl下相同级。也就是dt不能放入dd内，dd不能放入dt内。在dl下，dt与dd处于同级标签。DD标签可以若干。同时不能不加dl地单独使用dt标签或dd标签。

标题、标题对应列表效果演示
代码如下：

  1. <html>

  2. <body>

  3. <h1>一个定义列表：</h1>

  4. <dl>

  5. <dt>css网站</dt>

  6. <dd>网址为www.divcss5.com</dd>

  7. <dt>div css网站</dt>

  8. <dd>网址为www.divcss5.com</dd>

  9. <dt>div+css网站</dt>

  10. <dd>网址为www.divcss5.com</dd>

  11. </dl>

  12. </body>

  13. </html>

演示截图

扩展与提升

dl dt dd是一个组合型标签

标签标准用法，代码如下

  1. <dl>

  2. <dt>标题1</dt>

  3. <dd>列表1</dd>

  4. <dd>列表2</dd>

  5. </dl>

同时dd内可以放置<ul>标签使用。

三、html dl dt dd应用实例案例   -   TOP

1、HTML代码片段：

<dl>

<dt>欢迎来到divcss5</dt>

<dd>这里有，html教程</dd>

<dd>这里有，css模块</dd>

<dd>这里有，css教程</dd>

</dl>

2、dl dt dd案例截图

以上为html dl dt dd列表标签范例图

四、DL DT DD标签总结   -   TOP

我们实践使用dl dt dd标签最多地方，通常是具有标题，而标题下对应有若干列表简单的（栏目标题+对应标题列表）和标题对应下面有内容。在使用时候我们能简洁HTML代码情况下，学会灵活使用dl dt dd，了解和掌握标签结构语法。

在以后开发div+css适当运用dl dt dd标签你将会体会到带来的便利。

如需转载，请注明文章出处和来源网址：http://www.divcss5.com/html/h88.shtml

html dl dt dd标签元素语法结构与使用的更多相关文章

  1. html dl dt dd标签元素语法结构与使用

    dl dt dd认识及dl dt dd使用方法 标签用于定义列表类型标签. dl dt dd目录 dl dt dd介绍 结构语法 dl dt dd案例 dl dt dd总结 一.dl dt dd认识 ...

  2. 关于H标签 DL DT DD标签的一个小故事

    看了一篇关于SEO论坛的论文,大概故事内容是:一个专业的销售公司,里面SEO  技术多多,可就是销售网站的SEO的情况极为恼火.这天,老板又招到了一个SEO,直接聘为SEO主管全权负责网站的SEO,并 ...

  3. html中的dl,dt,dd标签

    html <dl> <dt> <dd>是一组合标签,使用了dt dd最外层就必须使用dl包裹,此组合标签我们也又叫表格标签,与table表格类似组合标签,故名我们也 ...

  4. 前端学习笔记系列一：15vscode汉化、快速复制行、网页背景图有效设置、 dl~dt~dd标签使用

    ctrl+shift+p,调出configure display language,选择en或zh,若没有则选择安装使用其它语言,则直接呼出扩展程序搜索界面,选择,然后安装,重启即可. shift+a ...

  5. html dl dt dd 标签语法与使用

    一.dl dt dd认识 html <dl> <dt> <dd>是一组合标 […]

  6. html-2, a img ul li ol dl dt dd 标签与列表标签的简单使用

    <!-- a:  a{ /*清除a标签的下划线*/ text-decoration: none; }  (1)超链接 href 超链接的地址 target: _self 默认 在当前中打开链接地 ...

  7. dl dt dd标签

    <dl>标记定义了一个定义列表,定义列表中的条目是通过使用<dt>标记(“definition title”,定义标题)和<dd>标记(“definition de ...

  8. dl,dt,dd标签的使用

    dl就是定义一个列表 dt说明白了就是这个列表的标题dd就是内容,能缩进和UL,OL性质差不多 <dl> <dt>标题标题</dt> <dd>内容内容& ...

  9. HTML中的ul, ol,li , dl,dt, dd标签

    ul: unordered lists ol: ordered lists li: Lists ol 有序列表. <ol><li>……</li><li> ...

随机推荐

  1. hdu 2037

    PS:   - -原本想的是排序开始时间和消耗时间..后来想到可以排序结束时间..后来还wa了一次,因为排序的时候溢出了 思路: 1 3 //13 4 //20 7 3 8 2 9 5 10 //36 ...

  2. chrom,firefox,ie不能上网，百度浏览器却可以。。。

    chrome和ie提示DNS查找失败,但是百度浏览器没任何问题,这是什么情况... 尝试很多方法后无用,命令行执行很多命令,无用, 试一下阿里的 DNS: 首选:223.5.5.5备用:223.6.6 ...

  3. N的阶乘的长度

    阶乘是乘法 , 乘法的话 , 几位数*几位数的位数 就是 哪两个几位数相加 .  这个可以用log10来解决 , 所以有如下代码 . #include<stdio.h> #include& ...

  4. POJ 3278 经典BFS

    进一步了解了bfs; 题意:给你n,然后用+,-,*三种运算使n变成k; 漏洞:在算出新的数字之后,一定要判边界,否则RE,而且在每一步后面都得加判断是否等于K,如果是即刻退出,否则WA,判这个的时候 ...

  5. HTTP Live Streaming直播（iOS直播）技术分析与实现

    前些日子,也是项目需要,花了一些时间研究了HTTP Live Streaming(HLS)技术,并实现了一个HLS编码器HLSLiveEncoder,当然,C++写的.其功能是采集摄像头与麦克风,实时 ...

  6. Extjs学习笔记(-):ComboBox联动

    http://www.cnblogs.com/wumin97136/archive/2007/12/24/1012720.html http://examples.ext.net/ http://ex ...

  7. MySQL 全文搜索支持

    MySQL 全文搜索支持 从MySQL 4.0以上 myisam引擎就支持了full text search 全文搜索,在一般的小网站或者blog上可以使用这个特性支持搜索. 那么怎么使用了,简单看看 ...

  8. iOS-UITableView性能优化

    使用不透明视图.     不透明的视图可以极大地提高渲染的速度.因此如非必要,可以将table cell及其子视图的opaque属性设为YES(默认值).其中的特例包括背景色,它的alpha值应该为1 ...

  9. java学习第十天

    第十二次课 目标 一维数组(创建访问) 一.概念与特点 1.概念 相同数据类型的有序集合[] 数组名: 容器的名字 元素:  下标变量,数组名[下标] 长度:  length 下标:   位置.索引  ...

  10. C#山寨版本【天翼拨号客户端】---内含详细抓包，模拟数据---万事俱备，只欠东风。

    官方的客户端的最大缺点: 1.一台电脑不允许使用同时启动多个网卡(目的是禁止使用虚拟WIFI或通过网卡后共享网络到路由器?): 2.使用路由器无法拨号(提示:不允许NAT后登录) 3.之前用某哥们破解 ...