列表与表格

• （1）列表
• • 1.1 有序列表：order list
  • 1.2 无序列表：unorder list
  • 1.3 自定义列表：define list
• （2）表格基础
• • 2.1 表格标题：caption
  • 2.2 表格头部：thead
  • 2.3 表格主体：tbody
  • 2.4 表格脚注：tfoot
  • 2.5 表格结构线
• （3）表格提高
• • 3.1 table 属性
  • 3.2 跨行跨列

（1）列表

列表分为 有序列表，无序列表 以及 自定义列表；

1.1 有序列表：order list

第一步
第二步
第三步

列表包裹：

第一步
第二步
第三步
百度

1.2 无序列表：unorder list

北京
上海
成都

列表嵌套：

北京
上海
迪士尼
外滩
东方明珠
成都

列表嵌套效果：

1.3 自定义列表：define list

自定义标题1
自定义内容1
自定义内容1
自定义标题2
自定义内容2
自定义标题3
自定义内容3

自定义列表实际应用场景：

（2）表格基础

在html中，表格分为表格标题、表格头部、表格主体以及表格脚注，如下图所示：

2.1 表格标题：caption

学生信息

2.2 表格头部：thead

姓名性别年龄民族政治面貌

2.3 表格主体：tbody

李四女20满族党员王五男18汉族团员赵六男21彝族党员

2.4 表格脚注：tfoot

共计4人

学习掌握 JS 知识后，就无需写定4人，而是可以直接根据tbody中 tr 数量进行判定；

2.5 表格结构线

...

后期更多调整使用CSS；

（3）表格提高

3.1 table 属性

............

3.2 跨行跨列

课程表
项目
上课
休息
星期
星期一
星期二
星期三
星期四
星期五
星期六
星期日
上午
3-2
3-3
3-4
3-5
3-6
3-7
休息
4-2
4-3
4-4
4-5
4-6
4-7
5-2
5-3
5-4
5-5
5-6
5-7
6-2
6-3
6-4
6-5
6-6
6-7
下午
7-2
7-3
7-4
7-5
7-6
7-7
休息
8-2
8-3
8-4
8-5
8-6
8-7

剩余关于表格颜色等需要等到学习CSS时再进行渲染；