用Html做制作静态网页 教案.docx

用Html做制作静态网页 教案.docx

《用Html做制作静态网页 教案.docx》由会员分享，可在线阅读，更多相关《用Html做制作静态网页 教案.docx（15页珍藏版）》请在冰点文库上搜索。

用Html做制作静态网页教案

教案_做制作静态网页Html用．

_____用Html做制作静态网页_____教学设计

课题名称

用html制作一个静态网站

设计者

专业类别

课时

3

使用教材

教学对象

中职二年级学生

教学目标

1.知识与技能

a）掌握html制作页面的方法；

b）理解html制作网页的标签；

c）灵活运用各类标签制作各式的网面。

2.过程与方法

a）教师和学生共同分析页面的构成，它是由几部分构成，每部分该怎么做；b）通过教师实际操作演示、学生自主探究实践，由浅入深，完成一系列任务，使学生熟练掌握html标签的运用。

3.情感态度与价值观

体会创作的乐趣，提高学生对制作页面的兴趣，在学习过程中学会交流，学会扩展创新。

教学内容．

只用html制作一个静态的网站

教学难点与重点

重点：

灵活运用各类标签。

难点：

掌握建页的思维方式。

学习者特征分析

该课面向中职二年级动画专业学生，经同学们已经具过了中一一年的学习与调整，对动画历史及发展有了有一定的自学能力，但是由于他们是中专的学生年一定的了解，学习能力自觉性约束力还是稍有欠龄还小，缺。

教学模式与策略

演示教学法、任务驱动

教学媒体选择

等的运sql服务器计算机（一般的配置就可以了，因为没有涉及到iis用）

【教学过程】

教学环节

教师活动

学生活动

设计意图

引入（5m）in

【教师提问】：

大家平时都,喜欢浏览网页吗对网页有什么要求?

这节课通过上几节课的教

生回学【速答】：

网快，页面漂亮，简洁…..

个这程过是引入话提题，

3．

制作整个静态

学，运用我们手上紧有的标签知识制作一个静态的网页，熟练掌握方法后我们能布局任何的页面

学高学生的习兴趣。

任务一：

分析结构5m（in）

）的分析主页（index.html两分个部：

结构（hand+body里面有两个部flash+logo分）即一个片头+Enter和字）intro.html分析第一页（（有三个结构：

hand+body内容）

观看老师操作并自主实践。

析分难度，逐级深入，导引生学成形自己思的方维法。

4．

分析

网站

的结构（5min）

导：

引【：

我们上节课回答】【教师问题】生学是怎么建网页的标签的首有先要有那些？

对

e>

文本，里建一个text>

ody>

handindex.html。

边看边操作首先写上：

2（5m、

语林河in）

>

5．

分析任务三：

制作背景2m（）in

然后我们要【教师提问】：

做什么bg先还是其它？

操作演示:

：

添加背景

topmargin=link=#ffffffalink=#ffffffvlink=#ffffff>

回【学生。

答】：

bg

导引生学成形己自建的思模维。

任务制四:

作页面主体10（min）

：

【教师问题】bg做好后我们就要进行主体的制作，我们要用那个标签最简单？

操作演示:

_1制作主体、1：

回【学生】：

答

ble>

导引学生形成己自建的思模维。

6．

7．

任务五：

整体测试（2min）

教师巡视、指导【教师提问】：

大的模型已有那些细好经做了，还节？

在IETester用不用版本的浏览器进行测试。

回学【生答】：

测试。

导引生学成形己自思的方维式。

第一部分总结：

3m（）in

标签的选择、1

很重要的，就是要一、2边制作一边测试，而不是制作完了再测试。

任务制六:

作hand5m（in）

文件夹在1、website文本，text里建一个为件名改后然把文intro.html。

首先写上：

2、语林畔

8．

分析任务：

制7作背景2m（）in

background=images/bg.jtopmargin=

pglink=#ffffffalink=#ffffffvlink=#ffffff>

任务八：

制作页面主体10（min）

border=align=centerwidth=99cellpadding=cellspacing=<

导引生学成形己自思的维方解式决问题的方式。

9．

/td>

2、主体src=images/link1.jpg>

src=images/link2.jpg>

href=

ews.html>

src=images/link3.jpg>

href=area.html>

src=images/link4.jpg>

href=look.html>

src=images/link5.jpg>

href=structure.html>

src=images/link6.jpg>

href=sever.html>

src=images/link7.jpg><

0

1．

/a>

href=contract.html>

src=images/link8.jpg>

src=images/link9.jpg>

3、主体牳?

楜慭敧屳氯湡畭?

灪屧>

background=images/lmbheight=00

g.jpg

valign=op>

align=center

width=80%

border=

src=images/pic1.jpg

vspace=_x0005_

align=left

1

1．

hspace=_x0005_>

src=images/text18.jpg>