HTML CSS DIV网页设计与布局（第3版）（微课版）-教案 第4章 表格.doc

PAGE8

网页设计与制作

授课教案

学年第学期

学院（部）专业（学部）

课程名称

电子商务网页设计与制作

任课教师

课内形式

理论教学□课内实践□理实一体?习题复习□考核评价□其他活动□

学习量

安排

课内：

课外形式

调查分析?小组研讨□实践任务?理论探究□考核评价□汇报展示□其他活动?

课外：

序号

4

授课日期

月日

月日

月日

月日

授课班级

课内教学内容：

第4章表格

课外学习任务：

（1）课前：

以小组为单位，分析表格的使用方法以及属性的使用并以PPT的形式记录下来。

（2）课后：

=1\*GB3①练习使用对应标签创建表格。

=2\*GB3②创建一个课程表。

eq\o\ac(○,3)创建嵌套表格。

教学目标：

知识目标

掌握表格的创建

掌握表格属性的使用

掌握表格边框和对齐

掌握表格的合并

掌握表格的结构和嵌套

能力目标

能够掌握表格的使用；

能够使用表格的属性对表格样式进行设置。

素质目标

较强的专业知识和自学能力；

丰富知识结构，提升专业知识；

掌握类和对象的使用，理解并应用专业知识。

重点难点及解决方法：

（1）重点：掌握表格的创建和属性的使用

解决方法：通过课堂示例+各种知识点相结合的方法，教师讲解表格和表格属性的使用方法，引导学生积极思考，掌握相应知识；同时通过课堂示例展示，使学生可以掌握创建表格、使用属性修改表格等相关知识；培养学生的思维能力和分析问题解决问题的能力。

（2）难点：掌握表格边框、背景、单元格合并等知识

解决方法：通过案例解析+启发式教学讲解的方式，细致讲解设置边框表格和表格结构等相关内容。帮助学生掌握表格相关样式的处理方法和技巧。从实用的角度帮助学生提高专业知识。

课内教学授课地点：

教学媒体：微课、PPT课件、网页图片、相关教学视频等。

设备及材料：多媒体计算机、多媒体教学广播软件、网页素材图片、教学载体源文件等。

其它资源：与本次课相关的专业技术论文电子版。

学习效果评价方式：

对理论知识学习效果评价：采用课堂提问、课后习题和查阅技术论文研读笔记的方式；

对技能的评价：教师对学生上交网页作品按制作要求进行综合性评价；

对职业素养的评价：采用学生自评、小组内评价和教师评价相结合的方式。

课后小结：

填表说明：1.序号，指该课程授课的顺序号，应与授课计划一致；2.授课形式在相应的选项打“√”。

课内教学内容及过程

时间分配

方法

及手段

1.创建表格

表格的开始标签是table，结束标签是/table。所有的表格内容都位于这两个标签之间。一个完整的表格除了包含table标签外，还要有行标签tr和单元格标签td。可以说，在页面中要创建一个完整的表格，至少要包含这3个标签。创建表格的语法格式如下。

table

tr

td表格的内容/td

/tr

/table

2.表格属性（教学重点）

【表格宽度】

表格的默认宽度是以内容为标准的。如果要设置表格的宽度为某一特定值，而与其中的内容无关，则可以使用width属性，其语法格式如下。

tablewidth=表格宽度

tr

td表格的内容/td

/tr

/table

其中，表格宽度可以是表格的绝对宽度（单位为px），也可以设置为相对宽度，即相对窗口的百分比。

【表格高度】

除了可以为表格指定宽度之外，还可以为表格指定高度。通常表格的高度都是由表格的行数及单元格中的内容决定的。为表格设置高度后，如果表格的行数与单元格中的内容使表格的高度高于指定的高度，则浏览器将以实际的高度显示表格；如果实际高度低于指定高度，则浏览器以指定高度显示表格。table标签的height属性可以用来指定表格的高度，其语法格式如下。

tableheight=表格高度

tr

td表格的内容/td

/tr

/table

【表格背景图片】

通过table标签的background属性可以为表格指定背景图片，这种指定方法有点类似为网页指定背景图片。如果背景图片比表格小，则会平铺该背景图片以充满整个表；如果背景图片比表格大，则会对背景图片进行裁剪，以适应该表格。设置表格背景图片的语法格式如下。

tablebackground=图像源文件地址

tr

td表格的内容/td

/tr

/table

background的属性值也是一个标准的URL地址，其图片可以为GIF或JPEG格式。

【单元格间距】

单元格间距是指表格中两个相邻单元格之间的距离和单元格与表格边框的距离。在默认情况下，单元格间距是2px。设置table标签的