html的有序列表和无序列表简单介绍:
本章节将会简单一下有序列表和无序列表的一些简单用法,希望能够给需要的朋友带来一定的帮助。
一.有序列表:
使用<ol>标签就可以定义一个有序列表,之所以称其为有序列表,就是因为可以使列表具有排序功能。
利用<ol>的type属性就可以实现有序排序功能。
type属性值:
1表示以 1,2,3,4 来表示。
a 表示以 a,b,c,d 来表示。
A 表示以 A,B,C,D 来表示。
i 表示以 i,ii ,iii 来表示。
I 表示以 I,II,III来表示。
代码实例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.51texiao.cn/" /> <title>蚂蚁部落</title> </head> <body> <ol type="1" start="5"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ol> <ol type="a"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ol> <ol type="A"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ol> <ol type="i"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ol> <ol type="I"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ol> </body> </html>
二.无序列表:
无序列表恰好和有序列表相对应,在列表的前面没有表示顺序的序号。
使用<ul> 标签既可以定义一个无序列表。
使用type属性可以定义列表前面的符号,属性值如下:
dise:实心圆(默认值)。
circle:空心圆。
square:实心方块。
代码实例:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.51texiao.cn/" /> <title>蚂蚁部落</title> </head> <body> <ul type="dise"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ul> <ul type="circle"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ul> <ul type="square"> <li>蚂蚁部落一</li> <li>蚂蚁部落二</li> <li>蚂蚁部落三</li> </ul> </body> </html>
原文地址是:http://www.51texiao.cn/HTML5jiaocheng/2015/0613/4143.html
最原始地址是:http://www.softwhy.com/
时间: 2024-10-09 17:13:45