1.有序列表
    有序列表是编号列表，用于对网页中的某些内容进行编号排列，以便使读者清晰地了解每行的顺序。在HTML中插入有序列表是通过<ol>和<li>标签来实现的。首标签<ol>和尾标签</ol>之间的内容是有序列表的内容，列表的每一项必包括在<li>与</li>之间。
有序列表的语法格式如下：
<ol>
    <li>列表项1</li>
    <li>列表项2</li>
 ………
    <li>列表项n</li>
</ol>
说明：<ol>标签有两个属性：type和start，type属性用于指定数字编号的样式。start属性用于指定起始编号，如不设start属性，默认使用阿拉伯数字，从1开始。
type属性和start属性的取值及含义如下：
type="1" start="10" 编号用阿拉伯数字，从阿拉伯数字10开始
type="a" start="b"  编号用小写英文字母，从小写字母b开始
type="A" start="K"  编号用大写英文字母，从大写字母K开始
type="i" 编号用小写罗马数字
type="I" 编号用大写罗马数字
例题：有序列表练习
<html>
<head><title>有序列表练习<title><head>
<body>
<ol type="A">
<li><font color="#0000ff" size="4" face="宋体">树上的鸟儿是喧闹的</font></li>
<li><font color="#0000ff" size="4" face="宋体">水里的鱼儿是沉默的</font></li>
<li><font color="#0000ff" size="4" face="宋体">天上的云儿是漂泊的</font></li>
<li><font color="#0000ff" size="4" face="宋体">地上的人儿是孤独的</font></li>
</ol>
<body>
</html>

2.有序列表
    无序列表是项目列表，列表内容可以按任意顺序排列。列表项前不是用连续编号而是用一个特定符号来标记，通常是在每一列表项前加上一个圆点儿。无序列表与有序列表的实现方法很相似，只是用标记<ul>来代替有序列表中的<ol>。
无序列表的语法格式如下：
<ul>
    <li>列表项1</li>
    <li>列表项2</li>
 ………
    <li>列表项n</li>
</ul>
说明：<ul>标签有type属性，用于设置项目符号类型，属性值有如下3种：
type="disc"  设置项目符号样式为圆点。
type="circle"  设置项目符号样式为圆圈。
type="square"  设置项目符号样式为矩形。
例题：无序列表练习
<html>
<head><title>无序列表练习</title></head>
<body>
<ul type="square">
<li><font color="#0000ff" size="4" face="宋体">树上的鸟儿是喧闹的</font></li>
<li><font color="#0000ff" size="4" face="宋体">水里的鱼儿是沉默的</font></li>
<li><font color="#0000ff" size="4" face="宋体">天上的云儿是漂泊的</font></li>
<li><font color="#0000ff" size="4" face="宋体">地上的人儿是孤独的</font></li>
</ul>
</body>
</html>

3.定义列表
    定义列表用于对清单条目进行简短说明，首标签<dl>和尾标签</dl>之间是列表内容，列表项目用标签<dt>引导，列表项目的说明用标签<dd>引导。通常<dt>和<dd>是一起出现的。一个列表项目可以对应一个说明项，也可以对应多个说明项。
定义列表中每个列表项有一个缩进的说明项，与字典的编排有相同的格式，所以又称为“字典列表”。
定义列表的语法格式如下：
<dl>
    <dt>列表项目1</dt>
    <dd>说明1</dd>
    <dd>说明2</dd>
    ………
    <dt>列表项目2</dt>
    <dd>说明1</dd>
    <dd>说明2</dd>
    ………
………
</dl>
例题：定义列表练习
<html>
<head><title>定义列表练习</title></head>
<body>
<font color="#0000ff" size=4 face="黑体">计算机网络的分类</font>
<dl>
<dt><font color="#ff0000" size=2 face="宋体">局域网</font></dt>
<dd><font color="#ff0000" size=2 face="宋体">LAN(LOcal Area Network)</font></dd>
<dd><font color="#ff0000" size=2 face="宋体">小区域内使用，成本低易管理</font></dd>
</dl>
<dl>
<dt><font color="#ff0000" size=2 face="宋体">广域网</font></dt>
<dd><font color="#ff0000" size=2 face="宋体">WAN(Wide Arae Network)</font></dd>
<dd><font color="#ff0000" size=2 face="宋体">Internet就是典型的广域网</font></dd>
</dl>
<dl>
<dt><font color="#ff0000" size=2 face="宋体">城域网</font></dt>
<dd><font color="#ff0000" size=2 face="宋体">MAN(Metropolitan Area Network)</font></dd>
<dd><font color="#ff0000" size=2 face="宋体">覆盖地理范围介于局域网和广域网之间</font></dd>
</dl>
</body>
</html>

HTML 列表详解的更多相关文章

  1. 28.Python list列表详解

    在实际开发中,经常需要将一些(不只一个)数据暂储起来,以便将来使用.说到这里,一些读者可能知道或听说过数组,它就可以把多个数据挨个存储到一起,通过数组下标可以访问数组中的各个元素.但使用数组存储数据有 ...

  2. adb shell命令模拟按键/输入input使用keycode 列表详解

    在adb shell里有一个非常使用的命令,模拟按键输入,这里首先不要理解为是键盘的模拟按键,下面命令的使用和键值做一个详解. input命令格式 adb shell input keyevent & ...

  3. Android开发 ExpandableListView 可折叠列表详解

    前言 在需要实现一个List的item需要包含列表的时候,我们就可以选择ExpandableListView. 其实这个View的原始设计还是ListView的那套.就是增加2层的ListView而已 ...

  4. ESX虚拟机文件列表详解

    http://jackiechen.blog.51cto.com/196075/210492 关闭状态时的文件列表: *-flat.vmdk:虚拟机的原始磁盘文件,包含整个虚拟机镜像.   *.nvr ...

  5. Xcode中的Info.plist字段列表详解

    Info.plist用于向iOS提供关于app,bundle或者framework的一些重要信息.它指定了比如一个应用应该怎样启动,它如何被本地化,应用的名称,要显示的图标,还有更多.Info.pli ...

  6. Python列表详解

    #列表:增,删,改,查.names=['N0','N1','N2',['EX1','EX2'],'N3'] '''#------------------------------------------ ...

  7. HMTL列表详解

    1.无序列表<ul> ul其实没啥好说的,大家用得最多就是它,它的属性无非就是type: disc circle square 2.有序列表<ol> H4的时候就有2个属性,t ...

  8. Info.plist字段列表详解

    常用字段: 1.获取版本信息: NSDictionary*infoDic = [[NSBundle mainBundle] infoDictionary]; NSString *localVersio ...

  9. python基础知识（列表详解）

    列表(list) 列表中可以存入整数.实数.布尔值.字符串.序列.对象 可变序列 列表  []  元素间隔用   ,号分隔 列表的创建和删除 使用赋值运算符直接创建列表 listname = [元素1 ...

随机推荐

  1. IOS UIButton用法详解

    这段代码动态的创建了一个UIButton,并且把相关常用的属性都列举了.希望对大家有用.   //这里创建一个圆角矩形的按钮UIButton *button1 = [UIButton buttonWi ...

  2. JSP内置对象---request对象（用户登录页面（setAttribute））

    在上节 request.jsp 中 添加脚本语句: <% request.setAttribute("password", "123456"); %> ...

  3. 文本过滤工具之AWK

    一.AWK简介 AWK三大文本处理工具之一,是一个非常强大的文本处理工具.它不仅是 Linux 中也是任何环境中现有的功能最强大的数据处理引擎之一.这种编程及数据操作语言(其名称来自于它的创始人 Al ...

  4. 安装数据库Mocrosoft.NET Application Security警告

    在安装sqlserver 2012的时候,出现了Mocrosoft.NET Application Security警告,这个时候可以检查是否联网,如果没有联网请连接上,然后重新检查就不再警告了.如果 ...

  5. iOS 8 TabBar 图片显示真实颜色

    “展信颜开” 我怎么想到这个词了呢……因为这个足以表达我现在的心情,有解决了一个问题,有了一个收获. 早上小伙伴问我“用自带的tab改图的颜色他会不显示?改tabitem.”我记得是可以显示的,但是他 ...

  6. Birt使用总结

    把report放到其他服务器要重新建立Data Source ,这是配置,拷贝项目时不会同时拷贝 (1)在EXTJs中利用Report实现报表的刷新 Ext.getCmp("showview ...

  7. 推荐记录片系列:Ultimate Factories系列和MegaStructures系列

    -_- 我刚刚看完记录片 <终极工厂:M1主战坦克> (Ultimate Factories: M-1 Tank) (2006), 决定推荐几个系列的记录片. →_→ 1993年后出厂的M ...

  8. sublime text 3 快捷键大全

    Sublime Text 3 快捷键精华版 Ctrl+Shift+P:打开命令面板Ctrl+P:搜索项目中的文件Ctrl+G:跳转到第几行Ctrl+W:关闭当前打开文件Ctrl+Shift+W:关闭所 ...

  9. Spark源码学习1.3——TaskSetManager.scala

    TaskSetManager.scala TaskSet是指一系列被提交的task,一般是代表特定的stage中丢失的partition.TaskSetManager通过一个TaskScheduler ...

  10. php+mysql的微信文章发布平台

    如何在微信上发表丰富图文的文章? 最近在新浪云平台上做了一个php+mysql的微信文章发布平台,丫丫说. 在线编辑文章,扫一扫即可分享到微信,发到朋友圈,非常简单! http://yayashuo. ...