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
投稿猜你喜欢
摘要一直比较想知道图片经过卷积之后中间层的结果，于是使用pytorch写了一个脚本查看，先看效果这是原图，随便从网上下载的一张大概224*2- 完整性约束是对字段进行限制，从而符合该字段达到我们期望的效果比如字段含有默认值，不能是NULL等 直观点说：如果插入的数据不满足限制要求，数
- MySQL8数据库安装一、Windows 环境下安装A、下载 MySQL下载地址Select Operating System:Micros
- 问：如何在SQL Enterprise Manager version 6.5下操作SQL Server 6.0的服务器？答：在使用SQL
- 1. 矩阵求逆import numpy as npa = np.array([[1, 2], [3, 4]]) # 初始化一个非奇异矩阵(数
- 本文实例讲述了JS实现匀速与减速缓慢运动的动画效果。分享给大家供大家参考，具体如下：<!DOCTYPE html><htm
- 空接口定义空接口是特殊形式的接口类型，普通的接口都有方法，而空接口没有定义任何方法口，也因此，我们可以说所有类型都至少实现了空接口。type
- 本文实例为大家分享了PyQt5实现简单数据标注工具的具体代码，分类用，供大家参考，具体内容如下第一个最大的图片是当前要标注的类别，接下来的两
- 前言本文主要给大家介绍了关于WebSocket部署服务器外网无法连接的相关内容，分享出来供大家参考学习，下面话不多说了，来一起看看详细的介绍
- 问题： pydev使用wx库开发的过程中，import时碰到wx可以识别，但是其它很多函数和变量上面全部是红叉，即无法识别。 解决方法： 1
- 本文实例讲述了PHP日志LOG类定义与用法。分享给大家供大家参考，具体如下：<?php/*** PHP log 类 */class C
- 几个星期前，SQL Server 2016的最新CTP版本已经发布了：CTP 2.4(目前已经是CTP 3.0)。这个预览版相比以前的CTP
- SQL（结构化查询语言）是一种通用数据库查询语言。SQL具有数据定义、数据操作和数据控制功能，可以完成数据库的全部工作。SQL语言使用时只需
- 注释标注解释，目的是帮助读者理解的文本也就是说，注释首先是文本，其二是说明，其三是思路，其四是例子注释有两种形式1. # ... 单行注释用
- 1 文件处理形式 近期由于处理大量数据，所以对于采用python进行处理文件的一些操作也打算整理一下；接下
- 代码如下:<％@LANGUAGE="VBSCRIPT" CODEPAGE="65001&quo
- 主类别表名：Navtion_TopSubject 主键fTopID Char(36) 次类别表名：Navtion_NodeSubject 外
- 什么是Densenet据说Densenet比Resnet还要厉害，我决定好好学一下。ResNet模型的出现使得深度学习神经网络可以变得更深，
- Python中的布尔类型Python中的布尔类型（bool）只有两个取值，分别是True和False。bool类型通常用于逻辑判断和条件控制
- 前言日志无论对于程序还是程序员都非常重要，有多重要呢，想要长期在公司健健康康的干下去就得学会阶段性划水，阶段性划水的一大关键的就是干活快过预
