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>内容内容& ...
随机推荐
- MyBatis与MySQL交互
MyBatis是我接触到的第一个框架,下面谈一谈我第一次使用MyBatis时的感悟. 首先是一些准备工作 下载相关的jar包.到GitHub上就行,上面有全面和完整的jar文件 在eclipse上安装 ...
- LCD 常用的客观效果指标和测试方法
1.DPI--精密度: 评分标准 DPI 评分 DPI<200 50 200≤DPI<250 60 250≤DPI<300 70 300≤DPI<350 80 350≤DPI& ...
- RAMCloud：内存云存储的内存分配机制
现在全闪存阵列已经见怪不怪了,EMC的XtremIO,还有VNX-F(Rockies),IBM FlashSystem.全闪存真正为效率而生,重新定义存储速度.凭借极致性能,高可用性,为您极大提高企业 ...
- Oracle EBS R12经验谈（二）
作者: jianping.ni 时间: 2009-2-13 12:52 标题: Oracle EBS R12经验谈(二) OAF页面:银行帐户开户人LOV值列表无值 在输入 应付超 ...
- gcov辅助脚本
gcov辅助脚本(金庆的专栏)代码覆盖测试查看结果时,需要进入代码所在目录,调用gcov,然后vi查看.因为代码目录结构复杂,进出子目录太麻烦,所以用以下脚本直接生成与查看.一般是用TSVN列出有更改 ...
- UNIX环境高级编程——主线程与子线程的退出关系
我们在一个线程中经常会创建另外的新线程,如果主线程退出,会不会影响它所创建的新线程呢?下面就来讨论一下. 1. 主线程等待新线程先结束退出,主线程后退出.正常执行. 示例代码: #include & ...
- 用SpriteBuilder简化"耕牛遍地走"的动画效果(一)
这又是一个使用SpriteBuilder带来便捷的例子 原文地址在: http://www.raywenderlich.com/32045/how-to-use-animations-and-spri ...
- Mybatis插件原理分析（三）分页插件
在Mybatis中插件最经常使用的是作为分页插件,接下来我们通过实现Interceptor来完成一个分页插件. 虽然Mybatis也提供了分页操作,通过在sqlSession的接口函数中设置RowBo ...
- Java枚举类"全方位"
作为一种长度固定,数据未定的一种存储数据集的数据类型,枚举类有如下方法可供参考. 普通类型的枚举类的创建 protected enum ColorEnum{ red,orange,yellow,gre ...
- Java 中Log4j的使用详情
Log4j 真的很简单,简单到令人发指的地步.不是要记录日志吗?那就给你一个Log ,然后你用Log 来写东西就行了,先来一个完整类示例: package test; import org.apach ...