网站制作的建立列表_第1页
网站制作的建立列表_第2页
网站制作的建立列表_第3页
网站制作的建立列表_第4页
网站制作的建立列表_第5页
已阅读5页，还剩1页未读， 继续免费阅读

下载本文档

版权说明：本文档由用户提供并上传，收益归属内容提供方，若内容存在侵权，请进行举报或认领

文档简介

1、 在html页面中，合理的使用列表标签可以起到提纲和格式排序文件的作用。列表分为两类，一是无序列表，一是有序列表，无序列表就是项目各条列间并无顺序关系，纯粹只是利用条列来呈现资料而已，此种无序标签，在各条列前面均有一符号以示区隔。而有序条列就是指各条列之间是有顺序的，比如从1、2、3一直延伸下去。列表的主要标签标 签描 述<UL>无序列表<OL>有序列表<DIR>目录列表<DL>定义列表<MENU>菜单列表<DL>/<DT>/<DD>定义列表的标记<LI>列表项目的标记 5-1

2、 无序列表<UL>无序列表使用的一对标签是<ul></ul>，无序列表指没有进行编号的列表,  每一个列表项前使用<LI>。<LI>的属性type有三个选项,这三个选项都必须小写:disc实心园circle空心园square小方块<ul>如果不使用其项目<li>的属性值,即默认情况下的<ul>会加"实心园"。格式1: <UL><LI>第一项<LI>第二项<LI>第三项</UL>格式2<ul>

3、0;       <li type=disc>第一项        <li type=circle>第二项        <li type=square>第三项</ul>示例 5-1.html<html><head><title>无序列表</title></head><body>

4、<ul><li>默认的无序列表加"实心园"<li>默认的无序列表"实心园"<li>默认的无序列表"实心园"</ul><ul><li type=square>无序列表square加方块<li type=square>无序列表square加方块<li type=square>无序列表square加方块</ul><ul><li type=circle>无序列表circle加空心园<li typ

5、e=circle>无序列表circle加空心园<li type=circle>无序列表circle加空心园</ul></body></html>5-2 有序列表<OL>有序列表和无序列表的使用格式基本一样，它使用标签<ol></ol>，每一个列表项前使用<li>。<ol>列表的结果是带有前后顺序之分的编号。如果插入和删除一个列表项，编号会自动调整。顺序编号的设置是由<ol>的两个属性type和start来完成的。start=编号开始的数字，如start=2则编号从2开始

6、，如果从1开始可以省略，或是在<li>标签中设定value"n"改变列表行项目的特定编号，例如<li value="7">。type=用于编号的数字,字母等的类型，如type=a，则编号用英文字母。为了使用这些属性，把它们放在<ol>或<li>的的初始标签中。 有序列表type的属性type 类 型描 述type=1表示列表项目用数字标号（1,2,3.）type=A表示列表项目用大写字母标号（A,B,C.）type=a表示列表项目用小写字母标号（a,b,c.）type=I表示列表项目用大写罗马数字

7、标号（,.）type=i表示列表项目用小写罗马数字标号（i,ii,iii.）格式1 <ol type=编号类型 start=value> <li>第1项 <li>第2项 <li>第3项 </ol>格式2 <ol> <li>第1项 <li>第2项 <li>第3项 </ol>实例：5-2.html<html><head><title>有序列表</title></head><body><ol><

8、;li>默认的有序列表<li>默认的有序列表<li>默认的有序列表</ol><ol type=a start=5><li>第1项<li>第2项<li>第3项<li value= 20>第4项</ol><ol type= I start=2><li>第1项<li>第2项<li>第3项</ol></body></html>5-3 嵌套列表将一个列表嵌入到另一个列表中，作为另一个列表的一部分，叫嵌套列表。

9、无论是有序列表和无序列表的嵌套，浏览器都可以自动地分成排列。实列：5-3.html<HTML><HEAD><TITLE>嵌套列表</TITLE></HEAD><BODY><h3>目录</h3><ol type=a><li>这是以序号类型a开头第一行容</li><li>这是以序号类型a开头第二行容</li><ol type=A start=3><li>这是以序号A类型C开头第一行容</li><li&g

10、t;这是以序号A类型C开头第二行容</li><ol type=1 start=51><li>这是以序号数字51开头第一行容</li><li>这是以序号数字51开头第二行容</li><li>这是以序号数字51开头第三行容</li></ol><li>这是以序号A类型C开头第三行容</li></ol><li>这是以序号类型a开头第三行容</li></ol><HR></BODY></HTML&g

11、t;5-4 定义列表的标记<DL>/<DT>/<DD>定义列表的标记也叫描述性列表，定义列表默认为两个层次，第一层为列表项标签<DT>，第二层为注释项标签<DD>。<DT>和<DD>标签通常是成对使用的。也可以一个列表项对应于几个解释项，这种方式很少用。<DD>默认的注释是显示在另一行中,当使用<dl compact="compact">后,注释项和列表项将显示在同一行。其格式为：<dl> <dt>第1项 <dd>注释1 <d

12、t>第2项 <dd>注释2 <dt>第3项 <dd>注释3 </dl>实例：5-4.html<html><head><title>定义性列表</title></head><body>定义性列表<P><dl><dt> WWW：<dd> WWW是(World wide web)的缩写，也可简写web;<dt> WWW：<dd> WWW又叫万维网;<dt> WWW：<dd> int

13、ernet提供的最常用的服务是WWW;</dl></body></html>5-5 目录列表<DIR>和菜单列表<MENU><dir>为目录列表标签,<menu>为菜单列表标签,它们的格式和无序列表<ul>是一样的,例如:格式1: <dir> <li>第一项 <li>第二项 <li>第三项 </dir>格式2 <menu> <li type=disc>第一项 <li type=circle>第二项 <

14、;li type=square>第三项 </menu>实例：5-5.HTML<html><head><title>无序列表</title></head><body><ul><li>默认的无序列表加"实心园"<li>默认的无序列表"实心园"<li>默认的无序列表"实心园"</ul><dir><li>默认的目录列表加"实心园"<li>默认的目录列表"实心园"<li>默认的目录列表"实心园"</dir><menu><li>默认的菜单列表加"实心园"<li>默认的菜单列表"实心园"<li>默认的菜单列表"实心园"</menu><dir><li type=square>目录列表square加方块<li type=s

人人文库> 全部分类> 应用文书 > 技术指导

温馨提示

  • 1. 本站所有资源如无特殊说明，都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等，如果需要附件，请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸，网页内容里面会有图纸预览，若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间，仅对用户上传内容的表现方式做保护处理，对用户上传分享的文档内容本身不做任何修改或编辑，并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容，请与我们联系，我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

最新文档

评论

0/150

提交评论