4.4.2　有序列表

与无序列表对应的是有序列表，表项不用设置就可以自动按顺序排列，初学者乍一看很神奇，现在来揭开其神秘面纱。

有序列表用＜ol＞＜/ol＞表示有顺序，里面的表项符与无序列表一样，只代表一个表项而已，在多个表项中，系统自动按顺序排列，语法代码如下。

＜！—下面一行表示有序列表—＞

＜ol＞

＜li＞表项一＜/li＞

＜li＞表项二＜/li＞

＜li＞表项……＜/li＞

＜/ol＞

与无序列表只相差在＜ol＞上。下面示例的内容与无序列表是一样的（表项都是一样），不同的是用＜ol＞＜/ol＞标记对取代了＜ul＞＜/ul＞标记对，代码4.7表示有序列表的用法。

代码4.7　源代码\第4章\有序列表.html

——————————————-文件名：有序列表.html——————————————-

01 ＜html＞

02 ＜head＞

03 ＜title＞有序列表＜/title＞

04 ＜/head＞

05 ＜body＞

06 ＜！—下面一行表示有序列表—＞

07 ＜ol＞

08 ＜li＞HTML+CSS完全自学手册＜/li＞

09 ＜li＞HTML+CSS完全自学手册＜/li＞

10 ＜li＞HTML+CSS完全自学手册＜/li＞

11 ＜li＞HTML+CSS完全自学手册＜/li＞

12 ＜/ol＞

13 ＜/body＞

14 ＜/html＞

【代码解析】与无序列表不相同的是，有序列表在项前面用数字序号表示，从第1项开始，每加一项序号也加1，效果如图4.8所示。

图　4.8　有序列表

注意　有序与无序只相差一个字母，但在区别上有明显不同。请读者在合适的位置上使用。在有序列表中还可以用其他有序符取代数字，＜ol type="#"＞＜/ol＞#可以有：A、a、I、I、1等。