网页制作下期电子教案.doc

网

页

制

作

教

案

执教人：李志英

20XX年下期

备课序号

1-2

课时

2

使用人

李志英

上课时间

2013-9-2

实训课题

Div布局（案例：环游世界网页的制作）

实训目标

1、学会插入APDIV并对其进行属性设置

2、学会利用div进行布局

3、完成案例“环游世界网页”的制作

实训重难点

DIV元素的属性设置及嵌套

实训准备

教师准备好上机素材和软件

实训器材

计算机+dwcs4+素材（环游世界网页素材）

教学过程

个性化设计

教学课件参照：div图层课件

引入：由实践内容效果图引入本课内容：

实践步骤：

准备素材，建立站点、建立新的网页文件

在网页中插入文字图片及div图层

编辑图层的属性，对图层进行嵌套

参照实践内容效果图完成“环游世界网页”的制作

浏览修改并保存

老师巡回指导学生完成实践任务

通过案例的教学方式，提高学生的学习兴趣

板书设计：见PPT

课时评测设计：网页制作完成后由老师进行检查评价

教学后记：大部分同学都能很好地完成实践任务

备课序号

3-6

课时

4

使用人

李志英

上课时间

2013-9-3

实训课题

APDiv布局（案例：冷酷青春网页的制作）

实训目标

1、学会插入APDIV并对其进行属性设置

2、学会利用div与表格相结合进行布局

3、完成“冷酷青春网页”的制作

实训重难点

DIV元素和表格结合使用

实训准备

教师准备好上机素材和软件

实训器材

计算机+dwcs4+素材（冷酷青春网页素材）

教学过程

个性化设计

教学理论内容参照课件：APDIV布局课件

引入：由实践内容效果图引入本课

实践步骤：

准备素材，建立站点、建立新的网页文件，首页取名为index.html

在网页中插入文字、图片、表格、div图层等内容，并进行相关属性的设置

学会设置div图层，并根据CSS完成对版面的美化操作

参照实践内容效果图完成“冷酷青春网页”的制作

浏览修改，保存网页

巡回指导学生完成实践任务

通过案例难度的提高，可以让学生更加熟练地掌握APDIV的布局方式

板书设计：见PPT

课时评测设计：学生完成任务后由老师进行检查给予指导评价

教学后记：学生能够灵活应用上一个案例所学到的内容，对所学知识进一步扩展

备课序号

7

课时

1

使用人

李志英

上课时间

2013-9-6

课题

总结“环游世界网页”和“冷酷青春网页”的制作情况

教学目标

总结归纳学生在制作“环游世界网页”与“冷酷青春网页”时所出现的问题

教学重难点

APDIV的嵌套

教学准备

多媒体和已经制作好的“环游世界网页”与“冷酷青春网页”

教学过程

个性化设计

引入：由学生的作品引入本课

教学过程：

在电脑上打开两个网页，把网页展示给学生看

简单介绍这两个网页的制作方法及所需要的技能

二、由学生总结归纳出在制作“环游世界网页”和“冷酷青春网页”时出现的问题及难点。

三、老师逐个分析这些问题，并帮助学生理解这些困难点，与学生共同探索制作网页的一些好方法

四、学生上台操作这两个网页制作过程中的关键地方

采用学生与老师互动的教学模式，极大地提高了学生的积极性

板书设计：

课时评测设计：

教学后记：学生积极性不高，配合情况不是很好

备课序号

8-13

课时

6

使用人

李志英

上课时间

2013-9-9

实训课题

CSS样式（案例：青岛教育在线网页的制作）

实训目标

1、能够熟练利用CSS样式对网页进行美化

2、能够修改操作CSS样式

3、完成“青岛教育在线网页”的制作

实训重难点

CSS的使用

实训准备

教师准备好上机素材和软件

实训器材

计算机+dwcs4+素材（青岛教育在线网页素材）

教学过程

个性化设计

教学理论内容参照课件：CSS样式课件

引入：由实践内容效果图引入本课

实践步骤：

准备素材，建立站点

建立新的网页文件，取名为index.html

在网页中插入各种文字、图片、表格、表单并进行属性设置

应用css样式完成对网页的美化

参照实践内容效果图完成“青岛教育在线网页”的制作

浏览修改，保存网页

巡回指导学生完成实践任务

青岛教育在线这个网页是一个综合性比较强的案例，通过完成它，可以增强学生对网页中各种元素熟练操作的能力

板书设计：见PPT

课时评测设计：学生完成任务后由老师进行检查给予指导评价

教学后记：该案例较复杂，学生完成的速度比较慢，所以需要的课时数较多，通过完成这个案例，学生的耐心与能力有了明显提高

备课序号

14

课时

1

使用人

李志英

上课时间

2013-9-13

课题

总结“青岛在线教育”网页的制作情况

教学目标

总结归纳出“青岛在线教育”网页的制作方法

教学重难点

表格的嵌套及美化

教学准备

多媒体和制作完成的“青岛在线教育”网页

教学过程