dl,dt,dd标签 VS 传统table实现数据列表（2）
作者：暴风彬彬 来源：彬Go 发布时间：2009-08-02 20:45:00
标签：表格,dl,dt,dd,标签,列表
dl、dt、dd数据列表
现在让我们来看看使用了HTML dl、dt、dd标签的数据列表。首先我们使用dl(definition list-自定义列表)标签来容纳整个数据结构，然后我们使用dt(自定义标题)标签和dd(自定义描述)标签来容纳数据中的标题和内容。
<dl>
<dt>Name: </dt>
<dd>Squall Li</dd>
<dt>Age: </dt>
<dd>23</dd>
<dt>Gender: </dt>
<dd>Male</dd>
<dt>Day of Birth:</dt>
<dd>26th May 1986</dd>
</dl>
而在css代码中，我们仅需让dt和dd向左浮动即可。
/*DL, DT, DD TAGS LIST DATA*/
dl {
margin-bottom:50px;
}
dl dt {
background:#5f9be3;
color:#fff;
float:left;
font-weight:bold;
margin-right:10px;
padding:5px;
width:100px;
}
dl dd {
margin:2px 0;
padding:5px 0;
}
从dl、dt、dd的实例中你应该能明显的看出它们的代码更简洁更平滑更符合语义化了吧。
看到这里，如果你还在坚持使用table标签来完成web表单或其它网页布局的话，现在是时候改变一下你的代码了。让你的工作更轻松些吧！
英文原文:How To Use DL, DT And DD HTML Tags To List Data vs Table List Data
0
投稿猜你喜欢
即使页面上只有一个元素它也是一个矩形的盒模型。其大小、位置、行为都可以通过CSS来控制。这里的行为是指当盒模型内部以及周围的内容发生变化时的- 用XMlhttp生成html页面，相关函数如下：<％ ’定义xmlhttp function Get
- 随着对Dreamweaver cs3中集成Spry功能的深入学习，了解并掌握到Spry框架的一些功能模块，其中就有通过Dreamweaver
- 因为要用到过滤一组中重复的数据，使之变成没有重复的一组数据的功能，百度了一下，居然有朋友乱写，而且比较多，都没有认真测试过，只对字符可以，但
- 锁定数据库的一个表 SELECT * FROM table WITH (HOLDLOCK) 注意: 锁定数据库的一个表的区别 SELECT
- 无聊,写了一个图片后加载的东东,感谢asfman帮忙<!DOCTYPE html PUBLIC "-//W3C//DTD X
- 一、数字类型所谓的“数字类”，就是指 DECIMAL 和 NUMERIC，它们是同一种类型。它严格的
- 采集开始第一步是分析要采集的页面。使用浏览器打开要采集的页面（如:http://sports.sina.com.cn/k/2008-09-1
- 介绍分面是指事物的多维度属性。例如一本书包含主题、作者、年代等分面。而分面搜索是指通过事物的这些属性不断筛选、过滤搜索结果的方法。可以将分面
- 一、在访客的内心深处做导航我讨厌迷失，不管是在道路上或是在线网络上。猜想一下？您的访客也是这样的。就像我们期望看到的道路上的路标一样，来帮助
- 但Insus.NET想到的是，从下面的SQL语句，就可以查询到数据库大小。因此分享于此。 代码如下:SELECT DB_NAME
- 本文给出一条 SQL 语句用于展示在同一名服务器上，不同的数据库间查询，注意当前连接用户要对两个库都有权限SQL Server 中 SQL
- 在MySQL中，对于索引的使用并是一直都采用正确的决定。简单表的示例：CREATE TABLE `r2` (ID` int(11) DEFA
- 主键表的主键（primary key，主关键字）是表中的一个或多个字段，它的值用于惟一地标识表中的某一条记录。一个表不能有多个主关键字，并且
- 在网页中放iframe，如果frameborder=0；就没有边框显示了；但动态创建时，在IE7中就不行了，从网上找到解决的办法，写出来记录
- 远程（如通过互联网）连接access数据库的示例：首先，需要使用TCP/IP，ADO及XML（需要安装Microsoft XML 4.0。）
- 如何在页面中快捷地添加翻页按钮？ 先编写一个nextprev.inc文件，再将代码<
- 所谓“评论”不是必须得有文本框，用户录入提交数据才算，广义上的评论包括用户的任何“表态”，典型如打分。我接触电子商务时间并不长，最早应该是0
- 1) 知识准备：为了使用Perl语言去存取mSQL和MySQL数据库的内容，必须安装一些API模块，以下列出一些必须安装的模块名称说明和其下
- 在JavaScript中，我们应该尽可能的用局部变量来代替全局变量，这句话所有人都知道，可是这句话是谁先说的？为什么要这么做？有什么根据么？
