dl,dt,dd,ul,li,ol区别及应用

本文详细介绍了HTML中的列表标签,包括无序列表<ul>、有序列表<ol>及定义列表<dl>的使用方法,并探讨了如何通过CSS对列表进行样式定制,如更改列表符号、实现鼠标悬停背景变化等。
 
ul: unordered lists 
ol: ordered lists 
li: Lists

ol 有序列表:
<ol>
<li>……</li>
<li>……</li>
<li>……</li>
</ol>
表现为:
1……
2……
3……

ul 无序列表,表现为li前面是大圆点而不是123:
<ul>
<li>……</li>
<li>……</li>
</ul>

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

dt 和dd中可以再加入 ol ul li和p,理解这些以后,在使用div布局的时候,会方便很多,w3c提供了很多元素辅助布局。

LI代码的格式化:

A).运用CSS格式化列表符:

以下是引用片段:
ul li{ 
list-style-type:none; 
}

B).如果你想将列表符换成图像,则:

以下是引用片段:
ul li{ 
list-style-type:none; 
list-style-image: url(/blog/images/icon.gif); 
}

C).为了左对齐,可以用如下代码:

以下是引用片段:
ul{ 
list-style-type:none; 
margin:0px; 
}

D).如果想给列表加背景色,可以用如下代码: 查看更多css教程

以下是引用片段:
ul{ 
list-style-type: none; 
margin:0px; 

ul li{ 
background:#CCC; 
}


E).如果想给列表加MOUSEOVER背景变色效果,可以用如下代码:

以下是引用片段:
ul{ list-style-type: none; margin:0px; } 
ul li a{ display:block; width: 100%; background:#ccc; } 
ul li a:hover{ background:#999; }说明:display:block;这一行必须要加的,这样才能块状显示!


F).LI中的元素水平排列,关键FLOAT:LEFT:

以下是引用片段:
ul{ 
list-style-type:none; 
width:100%; 

ul li{ 
width:80px; 
float:left; 

<ul><li>的区别

<LI> 的参数设定(常用):

例如: <li type="square" value="4">

type="square"

只适用于非顺序清单,设定符号款式,其值有三种,如下,内定为 type="disc":

以下是引用片段:
符号 是当 type="disc" 时的列项符号。 
符号 if" width=10 height=10 border=0> 是当 type="circle" 时的列项符号。 
符号 是当 type="square" 时的列项符号。 
value="4"

      只适用于顺序清单,设定该一项的数目,其後各项将以此作为起始数目而递增,但前面各项则不受影响,其值只能是 1,2,3.. 等整数,没有内定值。

      <UL>称为无序清单标记。

      所谓无序清单就是在每一项前面加上 、、等符号,故又称符号清单。

      <UL> 的参数设定(常用):

      例如: <UL type="square">

      type="square"

      设定符号款式,其值有三种,如下,内定为 type="disc":

以下是引用片段:
      符号 是当 type="disc" 时的列项符号。 
      符号 是当 type="circle" 时的列项符号。 
      符号 是当 type="square" 时的列项符号。


      <ul>是项目列表,<li>是列表项,项目列表就是用符号来列的,所以你列出来默认的就是黑点,还有一个是<ol>这个是编号列表,用数字来列的,也是用<li>做列表项

      <li>是 list item 即列表项,但列表有很两种,所以外面得有 <ul> 或者 <ol> 用来区别无序列表(小点点)和有序列表(1,2,3...)。

本系统旨在构建一套面向高等院校的综合性教务管理平台,涵盖学生、教师及教务处三个核心角色的业务需求。系统设计着重于实现教学流程的规范化与数据处理的自动化,以提升日常教学管理工作的效率与准确性。 在面向学生的功能模块中,系统提供了课程选修服务,学生可依据培养方案选择相应课程,并生成个人专属的课表。成绩查询功能支持学生查阅个人各科目成绩,同时系统可自动计算并展示该课程的全班最高分、平均分、最低分以及学生在班级内的成绩排名。 教师端功能主要围绕课程与成绩管理展开。教师可发起课程设置申请,提交包括课程编码、课程名称、学分学时、课程概述在内的新课程信息,亦可对已开设课程的信息进行更新或撤销。在课程管理方面,教师具备录入所授课程期末考试成绩的权限,并可导出选修该课程的学生名单。 教务处作为管理中枢,拥有课程审批与教学统筹两大核心职能。课程设置审批模块负责处理教师提交的课程申请,管理员可根据教学计划与资源情况进行审核批复。教学安排模块则负责全局管控,包括管理所有学生的选课最终结果、生成包含学号、姓名、课程及成绩的正式成绩单,并能基于选课与成绩数据,统计各门课程的实际选课人数、最高分、最低分、平均分以及成绩合格的学生数量。 资源来源于网络分享,仅用于学习交流使用,请勿用于商业,如有侵权请联系我删除!
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值