网页制作12.14

HTML的列表控件分为三类:
无序列表 unordered list
有序列表 ordered list
自定义表 definition list

  1. 无序列表 (Unordered List)
      与例子、名称、组件、想法或选项的列表相关的都可以用做无序列表。无序列表显示前列表有符号,可以使用样式表(CSS)更改符号样式或更改成图片。
      ul 无序列表元素
      li 列表项
    代码示例:

无序列表

默认样式:

  • 咖啡
  • 牛奶

使用ul元素的type属性更改列表项的样式:

  • 咖啡
  • 牛奶
  • 咖啡
  • 牛奶
  • 咖啡
  • 牛奶

使用CSS的list-style-type控制列表符号的样式:

  • 咖啡
  • 牛奶
  • 咖啡
  • 牛奶
  • 咖啡
  • 牛奶
  • 咖啡
  • 牛奶

使用CSS的list-style-position属性更改列表符号的位置:

  • 咖啡阿斯顿发沙发沙发上大发犬瘟热去玩儿去玩儿去玩儿去玩儿去玩儿去玩儿去玩儿去玩儿一天与人同一个电话的
  • 茶阿斯顿发生的发生的发生法大赛的发生的发送发沙发上的发生的发生的发送发生的发生的发生的发生的发送方
  • 牛奶

使用CSS的list-style-position属性更更改列表符号的位置:

  • 咖啡阿斯顿发沙发沙发上大发犬瘟热去玩儿去玩儿去玩儿去玩儿去玩儿去玩儿去玩儿去玩儿一天与人同一个电话的
  • 茶阿斯顿发生的发生的发生法大赛的发生的发送发沙发上的发生的发生的发送发生的发生的发生的发生的发送方
  • 牛奶

实际效果:

  ul_thumb[5]

  1. 有序列表 (Ordered List)
      有序列表用于以特定徐顺放声的列表项。
      ol 有序列表元素
      li 列表项
    代码示例:

有序列表:

  1. 咖啡
  2. 牛奶

有序列表也可以更改列表符号位其他的值:

  1. 咖啡
  2. 牛奶

显示效果:

  ol_thumb6

3.自定义列表(Definition List)
  定义列表用户带有各自定义的属于列表。
  dl 定义列表元素

  dt 一项

  dd 一个定义

代码示例:

自定义列表

Coffee
Black hot drink
Milk
White cold drink

显示效果:

  dl_thumb[1]

相关文章