为什么要使用自定义列表?

dl和ol, ul的区别?

要正确理解dl的意图, 理解 dl的 "语义" ! 才能知道为什么要使用dl, 以及在什么时候/ 什么情况下使用 dl?

dl叫自定义列表, 所以, 首先, 它是一种列表, 跟ul ol一样的使用.

但是, 它跟其他列表的 区别是:

dl是 列表项和其 注释的组合. 也就是说, 只有当你要对 列表项 进行 注释的时候, 你 才应该 使用 dl

对应关系:

dl 对应着 ul(或者ol)

dt 对应着 li

那么dd就是dl 特有的, 表示对dt的解释, 而 li由于不需要解释, 所以他后面就没有 内容了.

比如:

<dl>
<dt>Coffee</dt>
<dd>Black hot drink</dd> // 从语义上来说, 黑色的热饮料 就是 对 咖啡的解释
<dt>Milk</dt>
<dd>White cold drink</dd>
</dl>

那么, 只有当你需要对 列表项进行解释的时候, 你才需要 使用 dl, 否则就没有必要 使用 dl, 或者说使用dl就不是那么 恰当了.

而且, dd 在内容上, "在语义上", 也应该是对 dt的解释, 说明, 而不应该是跟它无关的东西.

在 数量上, dd也通常只需要 1个就好了. 多于1个, 就不恰当了.

自定义列表dl的使用原因和场合的更多相关文章

  1. 自定义列表dl

    语法格式 <dl> <dt>名词1</dt> <dd>名词1解释1</dd> <dd>名词1解释2</dd> ... ...

  2. 我教女朋友学编程html系列(7)—Html无序列表、自定义列表、有序列表及常用例子

    昨天写的那篇文章<我教女朋友学编程Html系列(6)—Html常用表单控件>,基本上有1000人左右看了,那边文章是我站在前人的肩膀上修改来的,添加了截图和说明,合并了例子,使之更容易被初 ...

  3. 2.html基础标签:无序+有序+自定义列表

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. sharepoint2010 创建自定义列表

    转:http://boke.25k5.com/kan77298.html 如何创建自定义列表 首先了解创建自定义列表中涉及到的几个名词:栏.内容类型. ①栏:栏即列.字段(Field),MSDN中给出 ...

  5. 有序列表ol,无序列表ul,定义列表dl

    ====================非常重要=================无序列表ul中有一个type属性四个属性值type="disc" 实心圆点(默认) type=&q ...

  6. HTML中级教程 自定义列表

    在HTML初级教程中我们教授了无序列表和有序列表,很不幸,很像Peter Cushing的博士Who,自定义列表很容易被忽略.可能是因为自定义列表需要比无序列表和有序列表更多的设置和似乎更少用.当遭遇 ...

  7. SharePoint 2013开发入门探索(一)- 自定义列表

    在SharePoint 2013中创建自定义列表的方式有很多,在网站内容页面添加应用程序就可以创建(站点内容-〉 您的应用程序),也可以通过SharePoint Designer 2013创建,而本文 ...

  8. [安卓] 16、ListView和GridView结合显示单元实现自定义列表显示效果

    List在各种手机应用中都有体现,是安卓UI设计的必修课. 本文将介绍在开发中如何利用ListView和GridView设计自定义列表. 下面分别是用ListView和GridView做的效果: 上面 ...

  9. 每日学习心得:SharePoint 2013 自定义列表项添加Callout菜单项、文档关注、SharePoint服务端对象模型查询

    前言: 前一段时间一直都比较忙,没有什么时间进行总结,刚好节前项目上线,同时趁着放假可以好好的对之前遇到的一些问题进行总结.主要内容有使用SharePoint服务端对象模型进行查询.为SharePoi ...

随机推荐

  1. ListView的使用-模拟微博随便看看栏目【执行与优化】

    今天我们来讲述一下如何使用ListView来模仿微博随便看看栏目(ps:这是老师布置的作业,所以…),在前篇博客中,我们讲述了细解ListView之自定义适配器的使用,所以本篇我们不以特别详细的讲述( ...

  2. Android——旋转屏幕导致Activity重建解决方法

    Android开发文档上专门有一小节解释这个问题.简单来说,Activity是负责与用户交互的最主要机制,任何“设置”(Configuration)的改变都可能对Activity的界面造成影响,这时系 ...

  3. K米测试

    K米评测 ------K米IOS4.3.0体验之旅 第一部分 :调研,评测 第一次上手体验:  像大多数同学一样,这也是我第一次使用k米这一类型的ktv点歌软件.我算是比较经常接触唱k的人,身边的朋友 ...

  4. BZOJ1031: [JSOI2007]字符加密Cipher

    传送门 后缀数组模板题 //BZOJ 1031 //by Cydiater //2016.9.21 #include <iostream> #include <cstring> ...

  5. 深入JVM-Class装载系统

    一.Class文件的装载过程 Class类型通常以文件的形式存在(当然,任何二进制流都可以是Class类型),只有被Java虚拟机装载的Class类型才能在程序中使用.系统状态Class类型可以分为加 ...

  6. 深入JVM-性能监控工具

    一.Linux下的性能监控工具 1.1 显式系统整体资源使用情况-top命令 top命令的输出可以分为两个部分:前半部分是系统统计信息,后半部分是进程信息. 在统计信息中,第一行是任务队列信息,他的结 ...

  7. Yocto开发笔记之《快速入门,环境搭建 & 编译》(QQ交流群:519230208)

    开了一个交流群,欢迎爱好者和开发者一起交流,转载请注明出处. QQ群:,为避免广告骚扰,申请时请注明 “开发者” 字样 ======================================== ...

  8. BZOJ3160: 万径人踪灭

    设a[i]=bool(s[i]=='a'),b[i]=bool(s[i]=='b'),考虑a和a.b和b的卷积,由于卷积是对称的,就可以统计出不连续回文子串个数了.可能说得比较简略.再用manache ...

  9. Windows系统自带工具的 cmd 命令

    目标 与计算机高手无关,只是为了减少鼠标点击的次数,提高效率. 适用范围 Windows XP,Windows 7,Window 8 (在Windows 7 下验证通过.) 使用方法 在 “运行“ 对 ...

  10. 移动端图片上传解决方案localResizeIMG先压缩后ajax无刷新上传

    现在科技太发达,移动设备像素越来越高,随便一张照片2M+,但是要做移动端图片上传和pc上略有不同,移动端你不能去限制图片大小,让用户先处理图片再上传,这样不现实.所以理解的解决方案就是在上传先进行图片 ...