html css点击展开列表,HTML之列表

列表有三种类型：

有序列表：列表项使用数字来标记

无序列表：列表项使用粗体圆点(典型的小黑圆圈)进行标记。

自定义列表：自定义列表以

开始。每个自定义列表项的定义以

开始。

一、有序列表格式：

1. 第一个列表项
2. 第二个列表项
3. 第三个列表项

运行结果：

第一个列表项

第二个列表项

第三个列表项

不同类型的有序列表：

1.编号列表：

1. 第一列表项
2. 第二列表项
3. 第三列表项
4. 第四列表项

50. 第五十列表项
51. 第五十一列表项
52. 第五十二列表项
53. 第五十三列表项

运行结果：

第一列表项

第二列表项

第三列表项

第四列表项第五十列表项

第五十一列表项

第五十二列表项

第五十三列表项

2.字母列表：

1. 第a列表项
2. 第b列表项
3. 第c列表项
4. 第d列表项

1. 第a列表项
2. 第b列表项
3. 第c列表项
4. 第d列表项

运行结果：

第a列表项

第b列表项

第c列表项

第d列表项第a列表项

第b列表项

第c列表项

第d列表项

3.罗马数字列表：

1. apples
2. bananas
3. lemons
4. oranges

1. apples
2. bananas
3. lemons
4. oranges

运行结果：

apples

bananas

lemons

orangesapples

bananas

lemons

oranges

二、无序列表格式：

• 无序列表项1
• 无序列表项2
• 无序列表项3
• 无序列表项4

运行结果：

无序列表项1

无序列表项2

无序列表项3

无序列表项4

不同类型的无序列表：

1.圆点列表：

• 无序列表项1
• 无序列表项2
• 无序列表项3
• 无序列表项4

运行结果：

无序列表项1

无序列表项2

无序列表项3

无序列表项4

2.圆圈列表：

• 无序列表项1
• 无序列表项2
• 无序列表项3
• 无序列表项4

运行结果：圆点变成圆圈

◦无序列表项1

◦无序列表项2

◦无序列表项3

◦无序列表项4

3.正方形列表：

• 无序列表项1
• 无序列表项2
• 无序列表项3
• 无序列表项4

运行结果：圆点变成方形

◾无序列表项1

◾无序列表项2

◾无序列表项3

◾无序列表项4

三、自定义列表：

coffee

- black hot drink

milk

- white cold drink

运行结果：

coffee

- black hot drink

milk

- white cold drink

四、嵌套列表：

• coffee
• tea
  • black tea
  • green tea
    • china
    • africa
• milk

运行结果：

•coffee

•tea

◦black tea

◦green tea

◾china

◾africa

•milk