dl dt dd标签

最新推荐文章于 2022-11-28 11:10:28 发布
最新推荐文章于 2022-11-28 11:10:28 发布
阅读量404 收藏
点赞数
文章标签： dd dl dt html Html HTML
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/tbwoyu/article/details/8252284
版权

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


< 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的简短说明或解 

例子1：
<dl> 
    <dt>Today </dt>
     <dd>Today is yesterday. </dd>
     <dt>Tomorrow </dt>
     <dd>Tomorrow is today. </dd>
</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> 
cshifo
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
网页制作小技巧 dl dt dd标签用法
09-25
本文将详细介绍`<dl>`、`<dt>`和`<dd>`标签的用法和应用场景。 `<dl>`标签： `<dl>`标记定义了一个定义列表，它的主要作用是展示一对对的名词和对其的解释。这种列表不同于普通的`<ul>`或`<ol>`，因为它不强调顺序...
CSS之排列系列--dl, dt, dd--使用/教程/实例
IT利刃出鞘的博客
12-05 1万+
本文用示例介绍CSS中的dl, dt, dd的用法。 dl, dt, dd是组合标签，使用了dt dd最外层就必须使用dl包裹，此组合标签我们也又叫表格标签，与table表格类似组合标签，故名我们也叫dl表格。 为常用标题+列表型标签。若没有对dl dt dd标签初始CSS样式，默认dd列表内容会缩进。
HTML+CSS详细知识点（下）
qq_52108058的博客
11-28 1126
1、无序列表（） 无序列表是一种，各个列表项之间没有顺序级别之分 语法： type属性 ul 和 li 都有 属性值： disc：默认属性，实心圆 circle：空心圆 square：实心正方形 如： 演示： 2、有序列表（） 有序列表是一种强调排列顺序的列表 语法： type属性：属性值： 1（默认），1 2 3 a或A，a b c/A B C i或I ，i ii iii /I II IIIstart属性：属性值：数字（规定项目符号的起始地址） value属性：属性值：数字（规定项目符号的数字） 如： 演
html中dl和dd是什么标签,html中dl和dd和dt标签的定义
weixin_40008339的博客
06-24 5973
我们在制作网页过程中用到列表时一般会使用或者标签，很少用刑标签，但是这个三个标签却有着不可忽视的作用，毕竟Web标准中要尽最大可能的使用已有的标签。它们的用途是：< dl>< /dl>用来创建一个普通的列表,< dt>< /dt>用来创建列表中的上层项目，< dd>< /dd>用来创建列表中最下层项目，< dt>&...
前端面试那些事【dt/dd、audio、onerror、标签、类、ID选择器、伪类选择器......
qq_46906413的博客
08-03 1510
列表项为"这是dt标签"且列表项内容也为"这是dd标签"的自定义列表。 < dt > 这是dt标签 < dt /> < dd > 这是dd标签 < dd /> < dd > 这是第二个dd标签 < dd /> < dt > 这是dt标签 < dt /> < dd > 这是dd标签 < dd /> < dd > 这是第二个dd标签 < dd /> ......
小猿圈web前端讲解dl、dt、dd标签
qq_42210792的博客
07-25 5395
于web前端工作者以及正在学习前端的同学来说dl、dt、dd标签一定不陌生的，今天小猿圈web前端讲师就给大家讲解一下dl、dt、dd标签用途等问题。 dd、dt标签是是列表用的。 我们平时常用的是<ul>< li>标签，不过dd、dt标签也蛮不错，特别是发布程序的时候功能模块列表什么的可以使用它来排版。 <dl></dl><dt&gt...
html 标签 dl dt dd使用说明
09-28
在一对`<dl>`标签之间，你可以放置一个或多个由`<dt>`和`<dd>`标签组成的对，来定义不同的项目及其描述。 `<dt>` 标签： `<dt>` 代表 "definition term"，用于定义一个名词或者概念。这些术语通常会以粗体或者特殊...
DD DT DL标签使用示例
09-28
在网页布局和内容展示中，`<dd>`、`<dt>` 和 `<dl>` 标签是HTML语言中用于创建定义列表的重要元素。这些标签在处理功能模块列表、术语解释或者详细信息展示时非常有用，因为它们能为用户提供清晰、有序的信息结构。...
html中dd和dl,dt三标签的作用
色彩变幻
12-09 9887
DL DT DD标签的详细描述及示例
志诚自制－2011,时间管理、效率为王
07-21 324
我们平时常用的是< ul>< li>标签，不过dd、dt标签也蛮不错，特别是发布程序的时候功能模块列表什么的可以使用它来排版。 < dl>< /dl>< dt>< /dt>< dd>< /dd> < dl>< /dl>用来创建一个普通的列表,< dt>< /dt>用来创建列表中的上层项目，< dd>< /dd>用来创建列表中最下层
DD DT DL标签
风之影
10-05 146
DD DT DL标签 2007年08月18日 星期六 下午 02:51 我们平时常用的是&lt; ul&gt;&lt; li&gt;标签，不过dd、dt标签也蛮不错，特别是发布程序的时候功能模块列表什么的可以使用它来排版。 &lt; dl&gt;&lt; /dl&gt;&lt; dt&gt;&lt; /dt&gt;&lt; dd&gt;&lt; /dd&gt; &l
html dl dt dd标签元素语法结构与使用
zhenghao35791的专栏
02-12 6134
欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术！ CSS手册CSS3手册CSS论坛CSS培训CSS任务网闻 DIV+CSS学习与CSS资源分享平台 首页 HTML基础 HTML入门 HTML5 CSS基础 CSS入门 CSS3 CSS Hack CSS工具 PS教程 CSS教程 WEB标准 CS
DIV+CSS中标签dl dt dd常用的用法
热门推荐
黄维
11-13 6万+
用来创建一个普通的列表, 用来创建列表中的上层项目， 用来创建列表中最下层项目， 和都必须放在标志对之间。   实例一： 效果:   源码： body{ font-size:12px; line-height:1.8; width:900px; margin:auto;} *{ margin:0; padding:0;} h1{ background:
dl dt dd 标签的用法（一）
weixin_34235371的博客
02-08 2542
html标签中 是一组合标签，使用了dt dd最外层就必须使用dl包裹，此组合标签我们也又叫表格标签，与table表格类似组合标签，故名我们也叫dl表格。 为常用标题+列表型标签。如没有对dl dt dd标签初始CSS样式，默认dd列表内容会一定缩进。 一般的写法： 首先dt和dd是放于dl标签内，标签dt与dd处于dl...
定义列表: DL DT DD
weixin_33835103的博客
04-11 247
定义列表和其他类型的列表稍有不同，它由两部分组成：名称和定义。DT 指定名称，为内联元素。DD 指定定义，为块级元素。 标准属性 id, class, title, style, dir, lang, xml:lang 事件属性 ondblclick, onmouseover, onkeypress, onkeydown, onkeyup 示例： ...
HTML基础主要标签的说明和使用---b，br，button，caption，dl，dt，dd标签
weixin_44046450的博客
06-04 1340
HTML基础主要标签的说明和使用---b，br，button，caption，dl，dt，dd标签 之前说明了a标签的说明和使用，现在我们来叫下一个标签，<b></b>这个标签对，这个标签就是拿来加粗文本的，代码如下： 未加粗文本 <b>加粗文本</b> 效果如下： 前面一个没有使用b标签，后面一个使用了b标签，这里可以很明显的看到...
html中dl，dt，dd标签的用法
Sky___Ice的专栏
05-23 1万+
dl 标签 -- 代表HTML自定义列表  dl标签是成对出现的,以开始,结束  自定义列表的开始使用标签,列表中每个元素的标题使用(definition term)定义,后面跟随(definition description)用于描述列表中元素的内容.  属性:  Common -- 一般属性  dl是definition lists的英文缩写  引用网址:http://www.dr
dl dt dd使用场景
最新发布
09-06
1. 词汇表：<dl>可以用于创建一个词汇表，<dt>用于标记出单词或术语，<dd>用于表示其解释或定义。 ```html <dl> <dt>HTML</dt> <dd>超文本标记语言，用于创建网页结构。</dd> <dt>CSS</dt> <dd>层叠样式表，...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值