我们平时常用的是< ul>< li>标签，不过dd、dt标签也蛮不错，特别是发布程序的时候功能模块列表什么的可以使用它来排版。

< dl>< /dl>< dt>< /dt>< dd>< /dd>

< dl>< /dl>用来创建一个普通的列表,< dt>< /dt>用来创建列表中的上层项目，<
dd>< /dd>用来创建列表中最下层项目，< dt>< /dt>和< dd><
/dd>都必须放在< dl>< /dl>标志对之间。看一下下边的例子您就会明白了：

dl ——define
list——定义列表
dt ——define list title——用于生成定义列表中各列表项的标题，重复使用可以定义多个列表项的标题。

dd——define list define——用于生成定义列表各列表项的说明文字段，重复使用可以定义多个说明文字段。dd是对应dt的简短说明或解

例子：
<dl>
<dt>Today
<dd>Today is yesterday.

<dt>Tomorrow
<dd>Tomorrow is today.
</dl>

例子2：

<html>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<title>无标题文档</title>

<style type="text/css">

<!--

dt {

        float: left;

        width: 60px;

        margin: 0px;

        padding: 0px;

}

dd {

        float: left;

        clear: none;

        width: 290px;

        margin: 0px;

        padding: 0px;

}

dl {

        width: 350px;

        font-size: 9pt;

        line-height: 1.5em;

        position:relative;

        margin: 0px;

        padding: 0px;

        left:15px;

}

.red {

        color: #FF3300;

}

#box {

        width: 500px;

        background-color: #F1F1F7;

}

#box #content {

        padding-top: 10px;

        padding-right: 10px;

        padding-bottom: 10px;

        padding-left: 20px;

}

-->

</style>

</head>

<body>

<div id="box">

<div id="content">

<img src=/Article/UploadFiles/200704/20070412091408274.gif align="left"/ >

<dl>

        <dt>商品名称：</dt>

        <dd><strong>[好大的一只啊] </strong>忧惠：<span class="red"><em>8.5折</em></span></dd>

        <dt>商品简介：</dt>

        <dd>商品名称商品名称商品品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品品名称商品名称商品名称商品名称商品名称 商品名称商品名称商品名称商品品名称商品名称商品名称商品名称商品名称商品名称……[<span class="red";>详细介绍</span>]</dd>

        <dt>店铺地址：</dt>

        <dd>商品名称</dd>

        <dt>联系电话：</dt>

        <dd>0000-12345678 87654321 </dd>

</dl>

</div>

</div> </body></html>

无标题文档

商品名称：
[好大的一只啊] 忧惠：8.5折
商品简介：
商品名称商品名称商品品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品品名称商品名称商品名称商品名称商品名称 商品名称商品名称商品名称商品品名称商品名称商品名称商品名称商品名称商品名称……[详细介绍]
店铺地址：
商品名称
联系电话：
0000-12345678 87654321

DD DT DL标签的更多相关文章

  1. dl标签和table标签

    dl标签定义了一个定义列表 <html> <body> <h2>一个定义列表:</h2> <dl>   <dt>计算机</ ...

  2. dt dl列表布局

    项目需要中 左边是房屋地址,右边显示几套房屋,如下图显示 ============ 开始想到使用 div标签,里面嵌套几个span,但是不利于对齐显示,一行还可以,多行了不方便 查找使用dl dt布局 ...

  3. 如何用<dl>标签做表格而不用table标签

    我们都知道很多的内容编辑器(TinyMCE编辑器.fck)都有插入表格功能,快速方便,但是这些表格用到的<table>标签,可以查看html源代码就能发现,table标签对搜索引擎不是很友 ...

  4. html之dl标签

    用来定义列表之用 通常与dt:定义列表中的项目 dd:描述列表中的项目 示例代码: <dl> <dt>数据库</dt> <dd>oracle</d ...

  5. HTML <dl> 标签

    <html><body><h2>一个定义列表:</h2><dl>   <dt>计算机</dt>   <dd&g ...

  6. 定义列表dl中标签 dt 与标签dd对齐方法，标签ul与标签li对齐

    不定义css样式时(默认情况): 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...

  7. dl dd dt与ul li

    像这种格式的网页,可以用dl来实现,比较方便

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

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

  9. 22----2013.06.29---HTML--html介绍.超链接和图片,表格,表单,表单标签,meta,复习当天内容

    01 HTML HTML :Hypertext Markup Language   超文本标记语言(类似于 裸奔的人.) 作用:向用户展示信息. CSS: Cascading 层叠样式表(类似于 人的 ...

随机推荐

  1. UIWebView加上safari风格前进后退按钮(转)

    今天在写程序内打开网页的功能,写工具条的时候发现系统图标里面竟然没有后退按钮,,由于我这个是静态库工程,不可能自己弄张图上去,不然使用本库的时候还得附上图片,经过一下午的搜索,终于找到个比较靠谱的,这 ...

  2. android 阿拉伯语下，图库中编辑运动轨迹图片，动画中会显示绿色的图片

    alps/packages/apps/Camera/src/com/android/camera/FileSaver.java 1:import java.util.Locale; 2:modify ...

  3. java 服务接口API限流 Rate Limit

    一.场景描述 很多做服务接口的人或多或少的遇到这样的场景,由于业务应用系统的负载能力有限,为了防止非预期的请求对系统压力过大而拖垮业务应用系统. 也就是面对大流量时,如何进行流量控制? 服务接口的流量 ...

  4. valgrind调查内存leak

    快有几个月没更新了,记录一下最近解决问题用到的工具吧. 最近代码跑压力测试,总是发现内存在无规律的慢慢增加,因此在Android上用上了大名顶顶的valgrind,说实话,真是名不虚传, 真是建议以后 ...

  5. js intanceof 或 typeof

    typeof和instanceof的区别 typeof和instanceof都可以用来判断变量,它们的用法有很大区别: typeof会返回一个变量的基本类型,只有以下几种:number,boolean ...

  6. Windows中安装Scrapy

    在linux中安装Scrapy只需要导入一些非python的支持包,在windows中安装Scrapy则是一波三折. 总之来说,主要分为以下几个步骤,可能由于系统问题(国内个人机子,甚至是小企业的机子 ...

  7. java编程：将数组的第一个为最大第二个为最小以此类推

    import java.util.Scanner; public class Max_Min { public static void main(String[] args) { int[] a = ...

  8. Map Hashtable Hashmap 集合四

    Map是通过键值对来唯一标识的,所以不能重复 存相同键值对 Hashtable存的是键值对 Hashtable<key,value> key,value 都不能为null 方法get(); ...

  9. linux下shell程序（一）

    shell结构 1.#!指定执行脚本的shell 2.#注释行 3.命令和控制结构 创建shell程序的步骤 第一步:创建一个包含命令和控制结构的文件. 第二步:修改这个文件的权限使它可以执行.使用c ...

  10. IOS 多线程的一些总结

    IOS 多线程 有三种主要方法 (1)NSThread (2)NSOperation (3)**   下面简单介绍这三个方法 1.NSThread 调用方法如下:         如函数需要输入参数, ...