dl,dt,dd标记在网页中要充分利用

来源:网络整理 时间:08-05-27 点击: 点击这里收藏本文

我们在制作网页过程中用到列表时一般会使用<ul>或者<ol>标签，很少用刑<dl>标签，但是这个三个标签却有着不可忽视的作用，毕竟Web标准中要尽最大可能的使用已有的标签。它们的用途是：

< dl>< /dl>用来创建一个普通的列表,

< dt>< /dt>用来创建列表中的上层项目，

< dd>< /dd>用来创建列表中最下层项目，

< dt>< /dt>和< dd>< /dd>都必须放在< dl>< /dl>标志对之间。

有如下代码

<html>
<head>
<title>一个普通列表</title>
</head>
<body text="blue">
<dl>
<dt>中国城市</dt>
<dd>北京 </dd>
<dd>上海 </dd>
<dd>广州 </dd>
<dt>美国城市</dt>
<dd>华盛顿 </dd>
<dd>芝加哥 </dd>
<dd>纽约 </dd>
</dl>
</body>
</html>

我们可以看到，<dt></dt>中间的文字即时我们没有进行缩进它也会怎地向前靠拢，而<dd></dd>中间的内容则自动向后缩进。这在腾讯新闻评论中已经使用到了

dl,dt,dd标记在网页中要充分利用的更多相关文章

  1. （转载）dl,dt,dd标记在网页中要充分利用

    (转载)http://www.jzxue.com/html/css/264I6DG6.html 我们在制作网页过程中用到列表时一般会使用<ul>或者<ol>标签,很少用刑< ...

  2. DIV+CSS中标签ul ol li dl dt dd用法

    ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...

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

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

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

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

  5. Div+css中ul ol li dl dt dd使用

    ol 有序列表.<ol><li>……</li><li>……</li><li>……</li></ol>表现 ...

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

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

  7. HTML 列表 <ol><ul><li><dl><dt><dd>

    <ol>标签-有序列表 定义和用法: <ol>标签定义有序列表. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,ol 元素的 "compact&q ...

  8. dl dt dd标签

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

  9. dl,dt,dd标签 VS 传统table实现数据列表

    过去有很多网页设计师喜欢将他们的网页效果图用table布局实现成网页,但是这样做会遇到一个比较麻烦的问题就是,后期调试和维护会相当的困难.现在,越来越多的前端开发er们开始使用xHTML+CSS替代最 ...

随机推荐

  1. 16：django 有条件的视图处理（Last-Modified和ETag）&&加密签名

    有条件的视图处理 上一节我们介绍了缓存来减轻服务器的负担,这里的有条件的视图处理也从一定程度上减轻了服务器的负担,在正式介绍之前,先来看两个概念:Last-Modified和ETag Last-Mod ...

  2. 【剑指offer】（第 2 版）Java 题解

    [剑指offer](第 2 版)Java 题解 第一章 面试的流程 略... 第二章 面试需要的基础知识 面试题 1. 赋值运算符函数 面试题 2. 实现 Singleton 模式 Solution ...

  3. Kerberos KDC not reachable

    水贴..我这里出现这个问题的原因是服务器上安装的是 oracle  jdk, 但是没有安装 JCE 拓展包. 解决方式有两个: 1. 换成 openJDK 2. 安装上 JCE 拓展包 java 8 ...

  4. Ubuntu下各种环境变量设置

    1.用户目录下的 .bashrc 文件在用户主目录下,有一个 .bashrc 文件,编辑该文件:$gedit ~/.bashrc 在最后边加入需要设置变量的shell语句,例如:export PATH ...

  5. 88. Merge Sorted Array【Easy】【双指针-不用额外空间归并两个有序数组】

    Given two sorted integer arrays nums1 and nums2, merge nums2 into nums1 as one sorted array. Note: T ...

  6. 【读书笔记】周志华《机器学习》第三版课后习题讨<第一章-绪论>

    虽然是绪论..但是...真的有点难!不管怎么说,一点点前进吧... 声明一下答案不一定正确,仅供参考,为本人的作答,希望大神们能多多指教~ 1.1 表1.1中若只包含编号为1和4的两个样例,试给出相应 ...

  7. Bzoj3837 [Pa2013]Filary（随机化）

    题面 权限题 题解 这题有一个很好的性质,就是一定有$k>\frac n2$.接着考虑怎么做. 我们随机选取一个数$x$,然后将所有数与它作差,那么只需要找出$k$个差值使得他们的最大公因数大于 ...

  8. 洛谷——P1626 象棋比赛

    P1626 象棋比赛 题目描述 有N个人要参加国际象棋比赛,该比赛要进行K场对弈.每个人最多参加两场对弈,最少参加零场对弈.每个人都有一个与其他人不相同的等级(用一个正整数来表示). 在对弈中,等级高 ...

  9. python3实践-从网站获取数据(Carbon Market Data-BJ) （pandas，bs4）

    自己边看边实践一些简单的实际应用,下面的程序是从某个网站上获取需要的数据. 在编写的过程中,通过学习陆续了解到一些方法,发现Python真的是很便捷. 尤其是用pandas获取网页中的表格数据,真的是 ...

  10. Flask实战第53天：cms编辑轮播图功能完成

    后端逻辑 表单验证, 这里编辑就是和添加的内容一样,所以可以直接继承添加轮播图的表单验证,然后多加一个轮播图的id即可 编辑cmd.forms.py class UpdateBannerForm(Ad ...