Chinaunix首页 | 论坛 | 博客
  • 博客访问: 465913
  • 博文数量: 88
  • 博客积分: 1677
  • 博客等级: 上尉
  • 技术积分: 667
  • 用 户 组: 普通用户
  • 注册时间: 2011-11-03 22:17
文章分类

全部博文(88)

文章存档

2013年(1)

2012年(18)

2011年(69)

分类: 系统运维

2011-11-10 23:11:14

ul ol li dl dt 
dd都是DIV+CSS做网页长用的东西,相当于一棵树的树技,下面就了解一下这些东西的全体用法,本人用dd,dt,dd用得很少,懂得结合使用对做架构是很有好处的哦!

DIV 
CSS网页布局中常用的列表元素ul ol li dl dt dd释义,块级元素div尽量少用,和table一样,嵌套越少越好

ol 
有序列表。

  1. ……

  2. ……

  3. ……


表现为:

1……
2……
3……
ul 
无序列表,表现为li前面是大圆点而不是123

  • ……

  • ……


很多人容易忽略 
dl dt dd的用法
dl 内容块
dt 内容块的标题
dd 
内容
可以这么写:


标题

内容1

内容2


  dt 
和dd中可以再加入 ol ul li和p
  理解这些以后,在使用div布局的时候,会方便很多,w3c提供了很多元素辅助布局。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的简短说明或解 


例子:
 
Today 
Today is yesterday. 

Tomorrow 
Tomorrow is today. 
 



例子2: 
 
 
XHTML 1.0 Transitional//EN" 
""> 
 
xmlns=""> 
 

无标题文档 
 
 
 

 
 
 
src=/Article/UploadFiles/200704/20070412091408274.gif align="left"/ > 

 
       
商品名称:
 
        
[好大的一只啊] 忧惠: 
class="red">8.5折
 
        
商品简介:
 
        
商品名称商品名称商品品名称商品名称商品名称商品名称商品名称商品名称商品名称商品名称商品品名称商品名称商品名称商品名称商品名称 
商品名称商品名称商品名称商品品名称商品名称商品名称商品名称商品名称商品名称……[ 
class="red";>详细介绍]
 
        
店铺地址:
 
       
商品名称
 
        
联系电话:
 
       
0000-12345678 87654321 
 
 
 
 
 
阅读(1570) | 评论(0) | 转发(0) |
给主人留下些什么吧!~~