DD DT DL标签
我们平时常用的是< 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标签的更多相关文章
- dl标签和table标签
dl标签定义了一个定义列表 <html> <body> <h2>一个定义列表:</h2> <dl> <dt>计算机</ ...
- dt dl列表布局
项目需要中 左边是房屋地址,右边显示几套房屋,如下图显示 ============ 开始想到使用 div标签,里面嵌套几个span,但是不利于对齐显示,一行还可以,多行了不方便 查找使用dl dt布局 ...
- 如何用<dl>标签做表格而不用table标签
我们都知道很多的内容编辑器(TinyMCE编辑器.fck)都有插入表格功能,快速方便,但是这些表格用到的<table>标签,可以查看html源代码就能发现,table标签对搜索引擎不是很友 ...
- html之dl标签
用来定义列表之用 通常与dt:定义列表中的项目 dd:描述列表中的项目 示例代码: <dl> <dt>数据库</dt> <dd>oracle</d ...
- HTML <dl> 标签
<html><body><h2>一个定义列表:</h2><dl> <dt>计算机</dt> <dd&g ...
- 定义列表dl中标签 dt 与标签dd对齐方法,标签ul与标签li对齐
不定义css样式时(默认情况): 代码如下: <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...
- dl dd dt与ul li
像这种格式的网页,可以用dl来实现,比较方便
- DIV+CSS中标签ul ol li dl dt dd用法
ul ol li dl dt dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦! DIV ...
- 22----2013.06.29---HTML--html介绍.超链接和图片,表格,表单,表单标签,meta,复习当天内容
01 HTML HTML :Hypertext Markup Language 超文本标记语言(类似于 裸奔的人.) 作用:向用户展示信息. CSS: Cascading 层叠样式表(类似于 人的 ...
随机推荐
- iOS swift cookie创建存储移除
保存网络请求的cookies,并存储到UserDefaults中 //保存COOKIES static func saveCookies(for urlStr: String){ if let url ...
- shell脚本中多命令单行执行_转
多命令一起执行 如果希望把几个命令合在一起执行, shell提供了两种方法.既可以在当前shell也可以在子shell中执行一组命令. 对{}和()而言, 括号中的重定向符只影响该条命令, 而括号外的 ...
- Unity3D游戏开发之游戏读/存档功能在Unity3D中的实现
喜欢我的博客请记住我的名字:秦元培,我的博客地址是:http://qinyuanpei.com 转载请注明出处,本文作者:秦元培, 本文出处:http://blog.csdn.net/qinyuanp ...
- WebMethod Session
[WebMethod(EnableSession = true)] public static string SayHello() { LxUserContext depno = HttpContex ...
- postgresql学习文档
字符串函数: http://www.php100.com/manual/PostgreSQL8/functions-string.html http://gavin-chen.iteye.com/bl ...
- Laravel中创建控制器
<?php /** * Created by PhpStorm. * User: chuang * Date: 17-1-14 * Time: 下午4:29 */ namespace App\H ...
- 【BZOJ3638】Cf172 k-Maximum Subsequence Sum 线段树区间合并(模拟费用流)
[BZOJ3638]Cf172 k-Maximum Subsequence Sum Description 给一列数,要求支持操作: 1.修改某个数的值 2.读入l,r,k,询问在[l,r]内选不相交 ...
- 巨蟒django之权限6: 权限控制表设计&&登录权限
1.权限控制表设计 内容 . 什么是权限? . 为什么要有权限? 不同用户拥有不同的功能 . 在web开发中,什么是权限? url 代表 权限 . 开发一个权限的组件,为什么要开发组件? . 表结构的 ...
- CAS单点登录------302个没完没了
我的配置如上 背景:Shiro + Cas 进行的单点登录配置! 其实这个问题很扯淡!看代码! 我本在shiro里面配置的Sucessurl !嘿嘿!我哭了!屌用没有! 我一脸懵逼大写的WHY??? ...
- 让vs只启动自己想调试的站点
VS中里面多个WEB项目如何只启动一个? 每次启动时,右下角都会出现一堆的 网站有10来个.即使设置了默认启动项目, 但每次按F5启动,或者哪怕是在项目上右键启动新实例 右下角都会出现这一堆的站点 有 ...