《认识动态网页.doc》由会员分享，可在线阅读，更多相关《认识动态网页.doc（3页珍藏版）》请在金锄头文库上搜索。
1、课 题认识动态网页课时1课时教学目标知识与技能：（1）了解动态HTML，动态网页的概念（2）能够实现简单的动态HTML效果（3）掌握动态网页的特性，体验动态网页和静态网页的异同过程与方法：（1）培养学生的探究学习能力（2）进一步提高学生的审美能力情感态度与价值观：利用精彩实例，激发学生学习动态网页的兴趣，在网页制作中培养审美能力，提升学生的信息素养。重 点实现简单的动态HTML效果以及动态网页的概念难 点动态网页和静态网页的异同教学方法任务驱动、自主探究、小组协作课前准备课 型新授课教 师 活 动学 生 活 动一、引入 展示做好的网页，让学生观察这个网页与我们上一章自己制作网页有何区别呢？请学
2、生就此展开讨论。提示：这是具有动态效果的网页，注意哪些地方发生了动态的变化？动态效果是如何实现的，这是什么技术呢？这是动态的HTML,它专指一种制作网页的方式。首先来了解一下它的概念。二、新课讲授（一）动态HTML的概念 在脱离网络环境下，网页下载到浏览器以后仍能够随时变换的HTML。常见的动态效果有很多，例如：u 光标悬停效果、单击、双击、网页加载u 在网页中加入日期，时间u 在网页中加入动感菜单u 文字特效，鼠标特效，网页特效强调：并不是网页上所有“动”的效果都是动态HTML效果。如：有的GIF图片本身就会动。在FrontPage中，提供了一些简单的动态HTML效果，下面我们来自学如何实现
3、简单的动态html效果。这部分内容比较简单，大家可以参照课本P106页图52操作步骤完成任务一。 布置任务一：（1）文字的悬停效果 把“美文中的父亲”设置鼠标悬停为“蓝色、加粗倾斜”提示：格式-动态HTML （2）图片的交换效果 用教师提供的pic1.jpg图片与完成交换特效。 注意：交换后的图片大小应和原图大小相同。是不是动态效果越多越好呢?，哪些地方加得恰到好处，哪些地方加得不大合适？ （3）如何更改和删除某一对象的动态HTML效果的设置教师总结：frontpage2000自带的动态HTML特效，实质上是在原网页上自动增加了一些代码。那么，除了frontpage2000自带的动态HTML特
4、效，还有更丰富更具个性化的特效，比如说鼠标特效、图形特效等等，那是一种代码的复用，如何使用我们将会在第三节学到。我们添加这么多的动态HTML效果，那么这个网页到底是不是动态网页呢？请同学们看书上动态网页是如何定义的。（二）、动态网页的概念这里所谓的动态主要强调的是人机关系，即，按照访问者的不同需要对访问者输入的信息作不同的响应，并提供相应的信息。教师展示网页，布置任务二：访问http:/192.168.10.66，单击发表作品，让学生体验动态网页。动态网页这个“动”字的涵义，主要强调的是一种人机交流，而不是一种动画技术。动态网页的一般特点如下：（1）动态网页以数据库技术为基础，可以大大降低网站
5、维护的工作量（2）采用动态网页技术的网站可以实现更多的功能，如用户登录、用户注册、在线调查、用户管理、订单管理等等。（3）动态网页实际上并不是独立存在于服务器上的网页文件，只有当用户请求时服务器才返回一个完整的网页。（三）、静态网页和动态网页的比较布置任务三：根据所学内容，完成P109表52静态网页动态网页扩展名是否以数据库作为基础能否完成交互功能能否及时更新和响应三、课堂总结通过这节课的学习，能够实现简单的动态HTML效果，理解相关的概念，但是想要更好理解和应用动态html，需要我们在今后不断的学习。激发学生兴趣，学生观察讨论发现有文字随鼠标变化、图片交换等特效学生观看教师展示的课件利用教师提供的素材围绕任务自主探索展开活动，在本机上完成任务，同时体会动态HTML请完成较好的同学演示积极思考老师提出的问题学生体验动态网页学生看书请学生讨论完成以下表格请学生进行总结课后作业完成P106实践题教 学 反 思
