网站导航网学 原创论文 原创专题 网站设计 最新系统 原创论文 论文降重 发表论文 论文发表 UI设计定制 论文答辩PPT格式排版 期刊发表 论文专题
返回网学首页
网学原创论文
最新论文 推荐专题 热门论文 论文专题
当前位置: 网学 > 设计资源 > DIVCSS技术 > 正文

DIVCSS网页布局中常用的列表元素ulollidldtdd释义

论文降重修改服务、格式排版等 获取论文 论文降重及排版 论文发表 相关服务

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

  ol 有序列表。

  Example Source Code <ol>

  <li>……</li>

  <li>……</li>

  <li>……</li>

  </ol>

  表现为:

  Example Source Code ……

  2……

  3……

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

  Example Source Code <ul>

  <li>……</li>

  <li>……</li>

  </ul>

  很多人容易忽略 dl dt dd的用法

  Example Source Code   dl 内容块

  dt 内容块的标题

  dd 内容

  可以这么写:

  Example Source Code <dl>

  <dt>标题</dt>

  <dd>内容1</dd>

  <dd>内容2</dd>

  </dl>

  dt 和dd中可以再加入 ol ul li和p

  理解这些以后,在使用div布局的时候,会方便很多,w3c提供了很多元素辅助布局

  ********************************************************************************************************************

  有个朋友问,关于dl,dt ,dd标签怎么用,我就回答了他,在此我就帖出来吧

  平时我都喜欢用ul ,li 来进行布局,那么我们进入xhtml代码时期,那么怎么不用最新的东西呢?

  大概的用法:

  了一个定义列表,定义列表中的条目是通过使用<dt>标记(“definition title”,定义标题)和<dd>标记(“definition description”,定义描述)创建的。<dt>给出了术语名,<dd>标记给出了术语的定义。

  也就是说<dt>用来创建列表中的上层项目,<dd>用来创建列表中最下层项目,<dt>和<dd>都必须放在<dl>< /dl>标志对之间。

  实例如下:

  <!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>

  <style >

  #d    {width:940px;margin:0 auto;}

  #d dl   {float:left;text-align:left;width:292px;display:inline;margin:10px 0 8px 20px;border-right:1px solid #b4c5da;}

  #d dt   {font-weight:bold;margin:0 0 10px;}

  #d dd   {float:left;width:96px;margin:0;}

  #d dd a {line-height:22px;}

  </style>

  <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

  <title>雪乌鸦的IT生活</title>

  </head>

  <body>

  <div id="d" >

  <dl>

  <dt>帮助说明</dt>

  <dd><a href="http://www.myeducs.cn" target="_blank">如何上传</a></dd>

  <dd><a href="http://www.myeducs.cn" target="_blank">如何录制</a></dd>

  <dd><a href="http://www.myeducs.cn" target="_blank">相册视频</a></dd>

  <dd><a href="http://www.myeducs.cn" target="_blank">如何订阅</a></dd>

  <dd><a href="http://www.myeducs.cn" target="_blank">如何分享</a></dd>

  <dd><a href="http://www.myeducs.cn" target="_blank">管理主页</a></dd>

  </dl>

  <dl>

  <dt>帮助说明</dt>

  <dd><a href=http://www.myeducs.cn target="_blank">如何上传</a></dd>

  <dd><a href=http://www.myeducs.cn target="_blank">如何录制</a></dd>

  <dd><a href=http://www.myeducs.cn target="_blank">相册视频</a></dd>

  <dd><a href=http://www.myeducs.cn target="_blank">如何订阅</a></dd>

  <dd><a href=http://www.myeducs.cn target="_blank">如何分享</a></dd>

  <dd><a href=http://www.myeducs.cn target="_blank">管理主页</a></dd>

  </dl>

  </div>

  </body>

  </html>

  • 上一篇资讯: 10款浏览器CSSReset的方法
  • 设为首页 | 加入收藏 | 网学首页 | 原创论文 | 计算机原创
    版权所有 网学网 [Myeducs.cn] 您电脑的分辨率是 像素
    Copyright 2008-2020 myeducs.Cn www.myeducs.Cn All Rights Reserved 湘ICP备09003080号 常年法律顾问:王律师