`

dl dt dd

阅读更多
dl dt dd

这3个标签用于定义 列表,

------
标签意义:

* <dl>     
      definition list
      最外层标签,包裹 <dt> 和 <dd>

* <dt>     
      definition title
      定义标题

* <dd>     
      definition description
      定义内容,和 <dt> 一一对应,
      <dd> 的内容默认会缩进显示,<dd> 中 可以直接显示内容,也可以 包含其它标签 显示各种内容,

------
结构:
<dl>
      <dt> ... </dt>
      <dd>
            ...
      </dd>

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


------
例子:
<body>
      <dl>
            <dt>ext learn</dt>
            <dd>
                  <ul class="ul_navigation">
                        <li><a href="learn/ext_load.jsp">ext load</a></li>
                        <li><a href="learn/ext_test.jsp">ext test</a></li>
                  </ul>
            </dd>
            
            <dt>ext learn2</dt>
            <dd>
                  <ul class="ul_navigation">
                        <li><a href="learn/ext_load2.jsp">ext load2</a></li>
                        <li><a href="learn/ext_test2.jsp">ext test2</a></li>
                  </ul>
            </dd>
      </dl>
</body>


------
分享到:
评论

相关推荐

    html css js网页制作实例 dldtdd实现列表功能

    html css js网页制作实例 dldtdd实现列表功能

    dl dd dt实现的图文混排效果

    以上就是使用`&lt;dl&gt;`, `&lt;dd&gt;`, 和 `&lt;dt&gt;` 实现图文混排的基本步骤和样式调整。根据实际需求,你可以进一步调整样式,如间距、字体大小、颜色等,以适应不同的设计风格。记得在实际应用中,要确保代码的语义化,同时...

    html 标签 dl dt dd使用说明

    基本结构: ...复制代码代码如下: &lt;dl&gt; &lt;dt&gt;这里是标题&lt;/dt&gt; &lt;dd&gt;这里是内容&lt;/dd&gt; &lt;dd&gt;这里是内容&lt;/dd&gt; &lt;dt&gt;这里是标题&lt;/dt&gt; &lt;dd&gt;这里是内容&lt;/dd&gt; &lt;dt&gt;这里是标题&lt;/dt&gt; &lt;dd&gt;这里是内容&lt;/dd&gt; &lt;/dl&gt;

    dl,dt,dd在什么时候适合使用呢?

    dt里是放置信息标题的,dd则是这个信息的简单概要的描述, 也就是说一个dt对应有一个dd来描述它 dd里面的内容可以是任意的,图片、文本甚至是视频或音频 多个类似的dt和dd组成一个dl 那么dl dt dd适合表现例如:带...

    CSS 之dl dt dd模拟表格实例代码

    贴出dl dt dd模拟表格实例,不推荐在实际项目中使用,可以了解dl dt dd的用法。测试浏览器:IE6\IE7\IE8\FF3.0 CSS: 复制代码代码如下: dl,dt,dd{ margin:0; background:#fff5fa; font-size:14px; } dl{ margin:0 ...

    dl、dt、dd列表标签实例

    /dt&gt;用来创建列表中的上层项目,&lt;dd&gt;&lt;/dd&gt;用来创建列表中最下层项目,&lt;dt&gt;&lt;/dt&gt;和&lt;dd&gt;&lt;/dd&gt;都必须放在&lt;dl&gt;&lt;/dl&gt;标志对之间。看一下下边的例子您就会明白了:创建一个普通列表 &lt;html&gt; &lt;head&gt; &lt;...

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

    &lt;dl&gt;标记定义了一个定义列表,定义列表中的条目是通过使用&lt;dt&gt;标记(“definition title”,定义标题)和&lt;dd&gt;标记(“definition description”,定义描述)创建的。&lt;dt&gt;给出了术语名,&lt;dd&gt;标记给出了术语的定义。 也...

    DL.DT.DD实现左右的布局简单例子第1/2页

    ### 使用DL、DT、DD实现左右布局的知识点详解 #### 一、背景介绍与问题提出 在网页设计中,常见的布局需求之一就是实现左文右图或者左标题右描述的效果。这种布局方式不仅美观,还能有效地提升用户体验。本文将通过...

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

    对于小型数据列表和表单,使用`&lt;dl&gt;`, `&lt;dt&gt;`, 和 `&lt;dd&gt;` 标签是一个更好的选择,因为它更符合语义化的原则,使得内容结构更加清晰。 然而,这并不意味着`&lt;table&gt;`标签已经过时。对于展示大量结构化数据,如财务...

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

    以下是一个使用dl、dt、dd的例子,对比传统的table布局,可以明显看到代码的简化: 传统的table数据列表: ```html &lt;td class="title"&gt;Name: &lt;td class="text"&gt;Squall Li &lt;td class="title"&gt;Age: ...

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

    本文将深入探讨如何使用DL-DT-DD组合来实现表格效果,并对比与使用UL的方式。 **DL-DT-DD元素解析** `&lt;dl&gt;`是定义列表(Description List)的标签,它用于定义一个名词或术语的集合,通常与描述或解释相关的术语对...

    CSS教程:用dl dt dd来制作列表

    本教程将介绍如何利用`&lt;dl&gt;`, `&lt;dt&gt;`, 和 `&lt;dd&gt;`元素来创建自定义列表,以及如何通过CSS进行样式控制。 `&lt;dl&gt;`(Description List)元素用于定义一个描述性列表,它包含一系列的术语(`&lt;dt&gt;`)和对应的描述(`&lt;dd&gt;`...

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

    列表元素ul、ol、li、dl、dt和dd是构建内容列表、导航链接和其他有序或无序信息的基石。了解并正确使用这些元素对于创建清晰、可访问且搜索引擎优化友好的网站至关重要。 首先,ul(无序列表)和ol(有序列表)是...

    dl,dt,dd,ul,li,ol区别及应用

    ol有序列表:&lt;ol&gt;&lt;li&gt;……&lt;/li&gt;&lt;li&gt;……&lt;/li&gt;&lt;li&gt;……&lt;/li&gt;&lt;/ol&gt;表现为:1……2……3……ul无序列表,表现为li前面是大圆点而不是123:&lt;ul&gt;&lt;li&gt;……&lt;/li&gt;&lt;li&gt;……&lt;/li&gt;&lt;/ul&gt;很多人容易忽略dldtdd的用法:dl内容块dt内容...

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

    以下将详细介绍HTML列表中的一些主要元素:`&lt;dl&gt;`, `&lt;dt&gt;`, `&lt;dd&gt;`, `&lt;ul&gt;`, `&lt;li&gt;`, 和 `&lt;ol&gt;` 的区别及应用。 1. **无序列表(Unordered List)** 无序列表通常用于显示不需按特定顺序排列的项目。它使用`&lt;ul&gt;`...

Global site tag (gtag.js) - Google Analytics