首先列表分成有序和无序分别是<ol><ul>,无序的比较简单,看个例子:
1 <html> 2 3 <body> 4 5 <h4>一个无序列表:</h4> 6 <ul> 7 <li>咖啡</li> 8 <li>茶</li> 9 <li>牛奶</li> 10 </ul> 11 <h4>一个有序列表:</h4> 12 <ol> 13 <li>咖啡</li> 14 <li>牛奶</li> 15 <li>茶</li> 16 </ol> 17 </body> 18 </html>
网页显示:,我们可以看到无序的只是个黑色实心点,有序的列表可以看到1,2,3,这只是默认的,如果我们要让它变成5,6,7呢:
1 <!DOCTYPE html> 2 <html> 3 <body> 4 5 <ol> 6 <li>咖啡</li> 7 <li>牛奶</li> 8 <li>茶</li> 9 </ol> 10 11 <ol start="5"> 12 <li>咖啡</li> 13 <li>牛奶</li> 14 <li>茶</li> 15 </ol> 16 17 </body> 18 </html>
网页显示:,只需在<ol star="value">中的value加个值。综上所述:有序列表放在<ol></ol>中,无序列表放在<ul></ul>中。当然它们两个的子属性不止这些,比如无序列表的属性还有“circle”:空心原点,“disc”:实心原点也是默认值,“square”:实心小正方形。来看个例子:
1 <html> 2 <body> 3 4 <h4>Disc 项目符号列表:</h4> 5 <ul type="disc"> 6 <li>苹果</li> 7 <li>香蕉</li> 8 <li>柠檬</li> 9 <li>桔子</li> 10 </ul> 11 12 <h4>Circle 项目符号列表:</h4> 13 <ul type="circle"> 14 <li>苹果</li> 15 <li>香蕉</li> 16 <li>柠檬</li> 17 <li>桔子</li> 18 </ul> 19 20 <h4>Square 项目符号列表:</h4> 21 <ul type="square"> 22 <li>苹果</li> 23 <li>香蕉</li> 24 <li>柠檬</li> 25 <li>桔子</li> 26 </ul> 27 28 </body> 29 </html>
网页显示:,有序列表的子属性:type="value"的值可以是“字母,阿拉伯数字,I,i",来看个例子:
<html> <body> <h4>数字列表:</h4> <ol> <li>我是数字</li> <li>我是数字</li> <li>我是数字</li> <li>我是数字</li> </ol> <h4>字母列表:</h4> <ol type="A"> <li>我是大写字母</li> <li>我是大写字母</li> <li>我是大写字母</li> <li>我是大写字母</li> </ol> <h4>小写字母列表:</h4> <ol type="a"> <li>我是小写字母</li> <li>我是小写字母</li> <li>我是小写字母</li> <li>我是小写字母</li> </ol> <h4>罗马字母列表:</h4> <ol type="I"> <li>我是罗马字母</li> <li>我是罗马字母</li> <li>我是罗马字母</li> <li>我是罗马字母</li> </ol> <h4>小写罗马字母列表:</h4> <ol type="i"> <li>我是小写罗马字母</li> <li>我是小写罗马字母</li> <li>我是小写罗马字母</li> <li>我是小写罗马字母</li> </ol> </body> </html>
网页显示:。我们可以看到无序和有序有个共性:都要用value来定义值。
我是数字