`
liudaoru
  • 浏览: 1579422 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

HTML中DL、DT、DD标记的使用

    博客分类：
  • Ajax
HTML 
阅读更多
<dl>标记定义了一个定义列表，定义列表中的条目是通过使用<dt>标记(“definition title”，定义标题)和<dd>标记(“definition description”，定义描述)创建的。<dt>给出了术语名，<dd>标记给出了术语的定义。

        一个定义列表中可以有多个术语名对应同一个给出的定义，也可有多重定义对应于一个术语名。同时也可以只给出术语名称而不对应定义，反之亦然。当然，这种结构往往并无实际意义，我们可以通过样式表，很轻松的实现这3个标记所达到的效果。

下面是一个例子：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title> New Document </title>
<style type="text/css">
<!--
dl   { background-color:#000;color:#fff;width:100px;}
dt   { cursor:pointer;width:100%;background-color:#666;}
.expand  { overflow:visible;}
.collapse  { height:16px;overflow:hidden;}
//-->
</style>
<script language="JavaScript" type="text/javascript">
<!--
function toggleDl(dt){
var dl=dt.parentNode;
if("collapse"==dl.className)dl.className="expand";
else dl.className="collapse";
}
//-->
</script>
</head>
<body>
<dl>
<dt onclick="toggleDl(this)">根结点</dt>
<dd>子结点1</dd>
<dd>子结点2</dd>
<dd>子结点3</dd>
<dd>子结点4</dd>
</dl>
</body>
</html>
分享到：
| Android Develop Challenge
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    HTML 列表中的dl,dt,dd,ul,li,ol区别及应用.doc

    例如，一个无序列表中可以嵌套有序列表，或者在定义列表中使用无序列表来提供更多信息。这样可以让页面内容更清晰，逻辑更明确。 6. **列表项内容的多样化** 列表项`&lt;li&gt;`中不仅可以包含纯文本，还可以嵌入段落`...

    html 标签 dl dt dd使用说明

    HTML中的`&lt;dl&gt;`, `&lt;dt&gt;`, 和 `&lt;dd&gt;` 标签是用于创建定义列表的，这种列表通常用于呈现术语、定义、属性等信息。它们在网页设计中扮演着重要角色，尤其在呈现带有标题和详细描述的数据时。下面我们将深入探讨这三个...

    HTML的dl、dt、dd标记制作表格对决Table制作表

    HTML中的`&lt;dl&gt;`, `&lt;dt&gt;`, 和 `&lt;dd&gt;` 标签是用于创建自定义列表的元素，这种列表主要用于定义术语和描述，而不仅仅是显示数据。与传统的`&lt;table&gt;`标签相比，它们在某些场景下可以提供更语义化的解决方案，尤其是在...

    DL-Dt-DD(做表格Css实现)

    Dt-DD(做表格Css实现).html`、`DL-Dt-Dd(替代 UL OL 方法).html`和`简单示例.html`这些文件，我们可以看到如何实际操作这些概念，观察不同的实现方法和样式调整，以了解如何在实际项目中应用DL-DT-DD实现表格。...

    网页制作小技巧 dl dt dd标签用法

    在这个例子中，`&lt;dl&gt;`包含了三个`&lt;dt&gt;`和相应的`&lt;dd&gt;`，分别定义了HTML、CSS和JavaScript的名称和解释。 在实际网页制作中，`&lt;dl&gt;`、`&lt;dt&gt;`和`&lt;dd&gt;`的组合可以用于创建术语表、技术文档、产品特性介绍等场景。它们...

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

    我们在制作网页过程中用到列表时一般会使用或者标签，很少用刑&lt;dl&gt;标签，但是这个三个标签却有着不可忽视的作用，毕竟Web标准中要尽最大可能的使用已有的标签。它们的用途是： &lt; dl&gt;&lt; /dl&gt;用来创建一个普通的列表...

    用标准dl,dt,dd标签抛弃table列表

    而使用`&lt;dl&gt;`, `&lt;dt&gt;`, `&lt;dd&gt;`，我们可以直接为`&lt;dt&gt;`设置标题样式，为`&lt;dd&gt;`设置内容样式，无需额外的类名，简化了CSS工作。 下面是一个简单的`&lt;dl&gt;`, `&lt;dt&gt;`, `&lt;dd&gt;`数据列表的例子： ```html &lt;dl&gt; &lt;dt&gt;Name:&lt;/...

    dl、dt、dd 标记来改造163邮箱的广告条

    在网页制作中，`&lt;dl&gt;`, `&lt;dt&gt;`, 和 `&lt;dd&gt;` 是一组重要的语义化标签，它们常用于定义定义列表（Description List），在HTML中用来表示术语和描述的关系。在本文中，我们将深入探讨如何利用这些标签来改造163邮箱的...

    html标记完全教程

    网页制作小技巧：dl dt dd标签用法----2008年9月15日 头部属性全接触----2008年9月15日 两个表格[Table]可以左右排放吗----2008年9月15日 marquee基本语法的全解释----2008年9月14日 HTML4.0不常用标签特性示例-...

    div+css布局必了解的列表元素ul ol li dl dt dd详解

    例如，可以对ul或ol应用不同的样式来改变其默认外观，使其符合设计要求，如改变列表项前的标记样式、调整列表项间距、对dl中的dt和dd进行样式控制等。此外，这些列表元素常用于创建垂直导航栏和侧边栏，以及在创建...

    常用HTML标记使用技巧 HTML标记

    - `&lt;dl&gt;`, `&lt;dt&gt;`, `&lt;dd&gt;` 用于创建定义列表，`&lt;dt&gt;` 定义术语，`&lt;dd&gt;` 描述术语。 7. **区块元素与内联元素**： - 区块元素如 `&lt;div&gt;` 和 `&lt;p&gt;` 占据一整行，有自己的独立空间；内联元素如 `&lt;span&gt;` 和 `&lt;a&gt;` 只...

    HTML 中的 dl(dt,dd)、ul(li)、ol(li) 使用方法

    HTML（超文本标记语言）是用于创建网页和网页应用的标准标记语言。...总结来说，HTML中的&lt;dl&gt;、和标签被广泛用于创建结构化的列表内容。了解和掌握这些列表的正确用法，对于构建清晰、有组织的网页内容至关重要。

    HTML5标记省略 语法规则

    - **dd标记**：`&lt;dd&gt;`标记的结束标记可以省略，如果`&lt;dd&gt;`紧跟另一个`&lt;dd&gt;`标记或`&lt;dt&gt;`标记，或者如果随后没有父标记更多的内容。 - **p标记**：`&lt;p&gt;`标记的结束标记可以省略，如果`&lt;p&gt;`标记后紧跟一系列特定标记...

    第22章 重新定义的dl元素

    `&lt;dl&gt;`元素的基本结构包含`&lt;dt&gt;`（定义项）和`&lt;dd&gt;`（定义描述）子元素。`&lt;dt&gt;`用于定义一个术语或概念，而`&lt;dd&gt;`则提供对该术语的解释或描述。例如： ```html &lt;dl&gt; &lt;dt&gt;HTML&lt;/dt&gt; &lt;dd&gt;HyperText Markup Language...

    HTML常用代码标记

    34. `&lt;DL&gt;`：定义列表标记，用于创建带有定义的列表。 35. `&lt;DT&gt;`：定义条目标记，列出定义项的标题。 36. `&lt;DD&gt;`：定义内容标记，给出定义项的具体内容。 37. `direction`：文本方向属性，如`direction="rtl"`...

    HTML中的各种标记详解

    - `&lt;dl&gt;`：定义列表，`&lt;dt&gt;`定义术语，`&lt;dd&gt;`定义描述。 6. **表格元素**： - `&lt;table&gt;`：创建表格。 - `&lt;tr&gt;`：表格行。 - `&lt;th&gt;`：表头单元格。 - `&lt;td&gt;`：普通数据单元格。 7. **块级和内联元素**： - `...

Magicbox
Global site tag (gtag.js) - Google Analytics