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

标签用于定义列表类型标签。

dl dt dd目录
  1. dl dt
    dd介绍
  2. 结构语法
  3. dl dt
    dd案例
  4. dl dt
    dd总结

一、dl dt dd认识
  -   TOP

html

是一组合标签,使用了dt dd最外层就必须使用dl包裹,此组合标签我们也又叫表格标签,与table表格类似组合标签,故名我们也叫dl表格(扩展阅读:table tr
td
table tr th表格布局)。为常用标题+列表型标签。如没有对dl dt dd标签初始CSS样式,默认dd列表内容会一定缩进。(扩展阅读:ul li、ol
li、li列表)

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


列表标题

列表内容

列表内容


...

语法解释:

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

标题、标题对应列表效果演示

代码如下:


  1. <</span>html>
  2. <</span>body>
  3. <</span>h1>一个定义列表:</</span>h1>
  4. <</span>dl>
  5. <</span>dt>css网站</</span>dt>
  6. <</span>dd>网址为www.divcss5.com</</span>dd>
  7. <</span>dt>div css网站</</span>dt>
  8. <</span>dd>网址为www.divcss5.com</</span>dd>
  9. <</span>dt>div+css网站</</span>dt>
  10. <</span>dd>网址为www.divcss5.com</</span>dd>
  11. </</span>dl>
  12. </</span>body>
  13. </</span>html>

演示截图

 dl dt dd标签元素语法结构与使用">

扩展与提升

dl dt dd是一个组合型标签

标签标准用法,代码如下


  1. <</span>dl>
  2. <</span>dt>标题1</</span>dt>
  3. <</span>dd>列表1</</span>dd>
  4. <</span>dd>列表2</</span>dd>
  5. </</span>dl>

同时dd内可以放置

标签使用。

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

1、HTML代码片段:


欢迎来到divcss5

这里有,html教程

这里有,css模块

这里有,css教程

2、dl dt dd案例截图

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> 标签用于定义列表类型标签. 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. Fiddler扩展之脚本录制

    Jmeter的脚本来源有4个,此处重点说明第4个 1)手动编写 2)badboy录制 3)自带录制功能 4)Fiddler生成 本文的主要用途:将fiddler抓取的请求,导出为jmx格式,方便jme ...

  2. NoFragment重大bug

    在activity中切换fragment,有以下几点问题需要注意: 例如做一个类似于这样的tab切换fragment的,有以下几点问题 1.切换fragment后,前几个fragment能透视,解决方 ...

  3. Python学习_13_继承和元类

    继承 继承的含义就是子类继承父类的命名空间,子类中可以调用父类的属性和方法,由于命名空间的查找方式,当子类中定义和父类同名属性或者方法时,子类的实例调用的是子类中的属性,而不是父类,这就形成了pyth ...

  4. 自学Aruba1.2-WLAN一些基本常识

    点击返回:自学Aruba之路 自学Aruba1.2-WLAN一些基本常识 1. LAN.WAN.WLAN.WIFI术语 1.1 局域网(Local Area Network,LAN) 是指在某一区域内 ...

  5. Python爬虫下载美女图片(不同网站不同方法)

    声明:以下代码,Python版本3.6完美运行 一.思路介绍 不同的图片网站设有不同的反爬虫机制,根据具体网站采取对应的方法 1. 浏览器浏览分析地址变化规律 2. Python测试类获取网页内容,从 ...

  6. centos7.4 搭建zabbix-server 3.4.5

    监控对服务器的重要性来说已经不需要我来一一赘述了,在众多的监控工具之中选择使用zabbix的原因是觉得它功能强大,可以引用的模板有很多,而且图形化做的草鸡棒. 废话就不多了,直接吃鸡. 本次搭建全部采 ...

  7. Aspects 源码学习

    AOP 面向切面编程,在对于埋点.日志记录等操作来说是一个很好的解决方案.而 Aspects 是一个对于AOP编程的一个优雅的实现,也可以直接借助这个库来使用AOP思想.需要值得注意的是,Aspect ...

  8. swiper插件的简单使用,实现图片轮播

    移动端和p c端经常会遇到写轮播图的情况,这里只是简单的说一下swiper插件的简单用法(移动端为例). <!DOCTYPE html> <html lang="en&qu ...

  9. dm-verity

    一.Device Mapper: dm-verity是内核子系统的Device Mapper中的一个子模块,所以在介绍dm-verity之前先要介绍一下Device  Mapper的基础知识. Dev ...

  10. 统计学习方法学习(四)--KNN及kd树的java实现

    K近邻法 1基本概念 K近邻法,是一种基本分类和回归规则.根据已有的训练数据集(含有标签),对于新的实例,根据其最近的k个近邻的类别,通过多数表决的方式进行预测. 2模型相关 2.1 距离的度量方式 ...