前端入坑之HTML列表

列表有三种类型:

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

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

自定义列表:自定义列表以

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

一、有序列表格式:

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

运行结果:

第一个列表项

第二个列表项

第三个列表项

不同类型的有序列表:

1.编号列表:

  1. 第一列表项
  2. 第二列表项
  3. 第三列表项
  4. 第四列表项
  • 第五十列表项
  • 第五十一列表项
  • 第五十二列表项
  • 第五十三列表项
  • 运行结果:

    第一列表项

    第二列表项

    第三列表项

    第四列表项

    第五十列表项

    第五十一列表项

    第五十二列表项

    第五十三列表项

    2.字母列表:

  • 第A列表项
  • 第B列表项
  • 第C列表项
  • 第D列表项
  • 第a列表项
  • 第b列表项
  • 第c列表项
  • 第d列表项
  • 运行结果:

    第A列表项

    第B列表项

    第C列表项

    第D列表项

    第a列表项

    第b列表项

    第c列表项

    第d列表项

    3.罗马数字列表:

  • Apples
  • Bananas
  • Lemons
  • Oranges
  • Apples
  • Bananas
  • Lemons
  • Oranges
  • 运行结果:

    Apples

    Bananas

    Lemons

    Oranges

    Apples

    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
  • 运行结果:圆点变成方形

    :black_medium_small_square:无序列表项1:black_medium_small_square:无序列表项2:black_medium_small_square:无序列表项3:black_medium_small_square:无序列表项4

    三、自定义列表:

    Coffee- black hot drinkMilk- white cold drink

    运行结果:

    Coffee- black hot drinkMilk- white cold drink

    四、嵌套列表:

    • Coffee
    • Tea
      • Black tea
      • Green tea
        • China
        • Africa
    • Milk

    运行结果:

    •Coffee•Tea◦Blacktea◦Greentea:black_medium_small_square:China:black_medium_small_square:Africa•Milk

    如果你依然在编程的世界里迷茫,不知道自己的未来规划

    你可能感兴趣的:(前端入坑之HTML列表)