div学习之div中dl-dt-dd的详解
dl dt dd认识及dl dt dd使用方法
<dl> 标签用于定义列表类型标签。
- 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标签。
标题、标题对应列表效果演示
代码如下：
- <html>
- <body>
- <h1>一个定义列表：</h1>
- <dl>
- <dt>css网站</dt>
- <dd>网址为www.divcss5.com</dd>
- <dt>div css网站</dt>
- <dd>网址为www.divcss5.com</dd>
- <dt>div+css网站</dt>
- <dd>网址为www.divcss5.com</dd>
- </dl>
- </body>
- </html>
演示截图
扩展与提升
dl dt dd是一个组合型标签
标签标准用法，代码如下
- <dl>
- <dt>标题1</dt>
- <dd>列表1</dd>
- <dd>列表2</dd>
- </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标签总结
- 纯CSS的dl、dt、dd 属性布局的通用表单效果，几乎和表格而已的效果一模一样。对于dl、dt、dd的设置建议不要用高度（height）和行高（line-height），在FF会产生错位，建议使用dt、dd的padding属性来定位。
我们实践使用dl dt dd标签最多地方，通常是具有标题，而标题下对应有若干列表简单的（栏目标题+对应标题列表）和标题对应下面有内容。在使用时候我们能简洁HTML代码情况下，学会灵活使用dl dt dd,在以后开发div+css适当运用dl
dt dd标签你将会体会到带来的便利。文章出处和来源网址：http://www.divcss5.com/html/h88.shtml
div学习之div中dl-dt-dd的详解的更多相关文章
- css案例学习之ul li dl dt dd实现二级菜单
效果 代码实现 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www ...
- DIV+CSS中标签ul ol li dl dt dd用法
ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...
- Div+css中ul ol li dl dt dd使用
ol 有序列表.<ol><li>……</li><li>……</li><li>……</li></ol>表现 ...
- HTML中的ul, ol,li , dl,dt, dd标签
ul: unordered lists ol: ordered lists li: Lists ol 有序列表. <ol><li>……</li><li> ...
- 前端学习笔记系列一：15vscode汉化、快速复制行、网页背景图有效设置、 dl~dt~dd标签使用
ctrl+shift+p,调出configure display language,选择en或zh,若没有则选择安装使用其它语言,则直接呼出扩展程序搜索界面,选择,然后安装,重启即可. shift+a ...
- dl,dt,dd标记在网页中要充分利用
dl,dt,dd标记在网页中要充分利用 来源:网络整理 时间:08-05-27 点击: 点击这里收藏本文 我们在制作网页过程中用到列表时一般会使用<ul>或者<ol>标签,很少 ...
- html中的dl,dt,dd标签
html <dl> <dt> <dd>是一组合标签,使用了dt dd最外层就必须使用dl包裹,此组合标签我们也又叫表格标签,与table表格类似组合标签,故名我们也 ...
- dl dt dd标签
<dl>标记定义了一个定义列表,定义列表中的条目是通过使用<dt>标记(“definition title”,定义标题)和<dd>标记(“definition de ...
- dl,dt,dd标签的使用
dl就是定义一个列表 dt说明白了就是这个列表的标题dd就是内容,能缩进和UL,OL性质差不多 <dl> <dt>标题标题</dt> <dd>内容内容& ...
随机推荐
- RPCZ中的智能指针单例
RPCZ中的智能指针单例 (金庆的专栏) 智能指针单例应用于 RPCZ 库以实现库的自动初始化与自动清理. RPCZ: RPC implementation for Protocol Buffers ...
- 精通CSS+DIV网页样式与布局--CSS文字效果
上篇文章,小编简单的介绍了一下CSS的一些基本语法,学习内容不是很复杂,都是CSS的一些入门知识,但是万丈高楼平地起,搭好地基,高楼大厦不在话下,学习任何课程,都必须从基础开始,一步一个脚印,踏实坚定 ...
- C++为什么要设计友元函数和友元类
1. 首先要提一下java,比如java定义一个类1.class,会生成字节码.java有反射机制,可以找到类对象,直接修改类的私有属性.逐渐反射机制成为了一种标准,sun做成标准,JDK的API函数 ...
- cocos2d-js（一）引擎的工作原理和文件的调用顺序
Cocos2d-js可以实现在网页上运行高性能的2D游戏,实现原理是通过HTML5的canvas标签,该引擎采用Javascript编写,并且有自己的一些语法,因为没有成熟的IDE,一般建立工程是通过 ...
- 海量数据挖掘MMDS week6: 决策树Decision Trees
http://blog.csdn.net/pipisorry/article/details/49445465 海量数据挖掘Mining Massive Datasets(MMDs) -Jure Le ...
- Linux之解决你的网络问题
在网络方面,Linux系统通常可以正常的工作,但是偶尔也会出现让人心烦一些的问题,下面就是一些网络问题的常用的解决方案. 如果你的网络接口看起来已经启动和运行,但是不能访问因特网,这时你就可以试试pi ...
- SpriteBuilder复杂CCB在App场景加载时报错排查
Player.CCB由body和arm两部分组成,它们都开启物理使能. 在GameScene.ccb中新建一个物理对象,将Player.ccb拖入该对象.此时编译运行App均正常. 然后继续添加其他物 ...
- 【翻译】Sencha Ext JS 5发布
原文:Announcing Sencha Ext JS 5 简介 我代表Sencha和整个Ext JS团队,很自豪的宣布,在今天,Sencha Ext JS 5发布了.Ext JS 5已经迈出了一大步 ...
- [转]ubuntu安装vncserver实现图形化访问
请注意: 如果在安装中部分软件无法安装成功,说明软件源中缺包,先尝试使用命令#apt-get update更新软件源后尝试安装.如果还是不行,需要更换软件源.更换步骤: 1)输入命令#cp /et ...
- Customer Form Issue: Automatic Matching Rule Set Defaults Value AutoRuleSet-1
In this Document Symptoms Changes Cause Solution References APPLIES TO: Oracle Receivables ...