关键词不能为空

当前您在： 主页 > 高中公式大全 >

网页设计之滚动字幕教案

作者：高考题库网
来源：https://www.bjmy2z.cn/gaokao
2020-12-09 20:51
tags:滚动字幕

气候变暖的影响和危害-群名字好听点的

2020年12月9日发(作者：羊成材)

2015—2016学年 第二学期

《网页设计之滚动字幕》教案
（公开课）








信息技术组：米畅
2016年6月22日



授课
内容
网页设计之滚动字幕 课时安排 1课时

知识与技能
会使用标签制作滚动字幕，并理解属性与属性值之间的含义。
过程与方法
巩固对Dreamweaver软件中“标签”和“标签检查器”的使用。学会合
理的规划滚动 图片或文字的出现效果。
教学
目标
要求
情感态度与价值观
本节学习将滚动字幕作为一个单独的元素进行讲解，选取更为简单易懂
的案列来帮助学生掌握重点。同时 引导学生注意观察周围事物，将滚动这种
表现方式不仅仅局限于网页设计，而是利用Dreamweav er这个软件来实现该
效果。待学生熟练掌握滚动字幕的制作后，就可以在他们的网站里自由发挥。由此引导学生理解什么是触类旁通，真正授人以渔。


重点：
利用滚动字幕增强网页表现力。
难点：
利用“标签检查器”为标签的各个属性设置参数。

教学
重点
难点
教学
方法 讲授法、演示法、任务驱动法
手段

教

学

内

容

提

纲

一、新课引入
同学们，对于HTML语言 的学习已有一段时间，其中我们认识了很重要
的一个元素——标签。大家先跟老师一起回顾所学过的标签 。【播放幻灯片】
以上这些标签都是构成静态网页的基本元素，若想实现如示例所示的网
页效 果，我们该如何制作呢？先请同学们欣赏这几个网页，找出它们的共同
点。【展示滚动字幕网页】
师将发言简单总结，确定本节课的主题——滚动字幕。
二、本课教学
师：既然同学们都见过滚动字幕，那么它到底是如何实现的呢？接下来


—1—
请大家观看一段微视频，观看的同时思考以下几个问题。【提出问题，播放视
频】
① 滚动字幕的标签如何表示？
② 滚动字幕的标签中有哪些属性？
③ 该标签是否可以用来制作滚动图片？
通过微视频我想同学们对滚动字幕都有了自己的认识，那么刚才提 出的
三个问题心中也有了答案。哪位同学来回答第一个问题？【提问回答】
①
② behavior滚动方式、direction滚动方向、scrolla mount滚动速度、
scrolldelay滚动时停顿的时间
③ 可以
< br>师：在微视频中学生不仅学习了一个新标签，同时也获得了如何制作滚
动字幕的信息。现在，我们 发布挑战一，请同学们自主完成，速度最快的两
名同学可以充当小老师帮助其他同学。
挑战一 ：根据已给的文字素材，每位同学制作滚动字幕，表现形式不限。
最先做完的三名同学将为所在大组赢得 一面小红旗。【展示学生作品，并上台
进行演示】
一探究竟：大部分同学已经实现文字滚动效 果，在前面思考的问题中有
一个“滚动字幕的标签中有哪些属性”，但是对标签的属 性有多少
同学能熟练运用呢？为了能让大家实现更多的滚动效果，请同学们按照老师
所说的步骤 ，一步一步的执行，然后仔细观察网页中的文字发生了怎样的变
化。【播放幻灯片】
① 将behavior属性后面双引号中的内容进行修改
② 将direction属性后面双引号中的内容进行修改
③ 将scrollamount属性后面的数值增大，接着减少
④ 将scrolldelay属性后面的数值增大，接着减少

简单的我们已经掌握，像游戏一样我们来提升难度。刚才思考的第三个


—2—
问题是“该标签是否可以用来制作滚动图片”，答案是当然可以。所以接下来
请同学们利用老师下发的素材包括文字、图片，挑选自己认为合适的难度任
务来完成。完成速度较快的并 且充满创意的同学，可以帮助其他同学。【播放
幻灯片】
挑战二：
难度系数：一颗星
自由发挥，制作一段滚动字幕，内容自定义。
难度系数：两颗星
自由发挥，利用已给图片素材制作滚动图片。
难度系数：三颗星
自由发挥，利用已给的图片和文字素材，制作多样的滚动内容。

先将全体 学生分为四个组，然后学生根据情况自由选择不同难度的挑战，
并在20分钟内完成。老师检查通过后， 可在所对应的大组加上相应的星星数。
最后，星星数最多的一组为获胜组。【展示学生作品】

三、课堂小结
首先，采用快问快答的方式对本节课的知识点进行一个巩固，老师提问
学生集体回答。
师：最后我们一起对本节课进行一个小结。在Dreamweaver中制作滚动
字幕，无需手动输入 代码，可以使用HTML的标签，并设置属性即
可。标签的属性 常用的有四个，分别为behavior滚动方式、
direction滚动方向、scrollamo unt滚动速度、scrolldelay滚动时停顿时间。
当然也可以用来制作滚 动图片，只需将我们要滚动显示的单张或多
张图片排列好选中后，再添加标签并设置 参数就可以了。


课外
学习
要求

师：课后，请同学们利用今天所学的滚动字幕，为自己所作网站增添亮
丽一笔。同时结 合课本第72页至73页，自己尝试利用AP Div元素（层）布


—3—
局网页。


这堂课我把教学内容转化为具有潜在意义的问题，让 学生产生强烈的探
究意识，使学生的整个学习过程成为“猜想”，继而紧张地探索，期待寻找答
案和理由的一个过程。在实际情况下进行学习，可以先让学生见证网页效果，
然后自己动手尝试达到同样 的效果。并且教师需要引导学生将不同参数值设
置的情况进行对比，发现不同加深映象，这样获取的知识 ，不但易于保持，
而且易于迁移到陌生的问题情境中。
本课沿用了我一贯的教学手段“挑战难度任务”，同时这一环节也贯穿了
教学
后记
始终，让学生在竞争中得到欢乐，获得知识。由易到难的制作过程，促使学
生一步步掌握了滚动 字幕的制作技巧，再利用到自己的网站中实现增强网页
表现力这一目标。
最后的快问快答的总 结形式，再一次加深了学生对新知识的记忆，更主
要强调了创新的重要性。同时，温故知新对学生变相的 提出了课外练习的要
求，促进学生将学习过的与未学习的相互结合，自主练习，锻炼其独立性。
本节课在环节上没有太大问题，但在细节上比如前后衔接、教学用语、
课堂仪态仍有一些问题需要改进 。讲课语速较快，不够稳、准，还需加强练
习。



—4—

社会工作专业介绍-重庆小吃


关于成功的作文-好听的网游名字大全


北京化工大学录取分数线-想和你一起慢慢变老


辅音音素-360无线wifi


爱国格言-汤景延


直线的两点式方程-发展党员的方针


高中物理学习方法总结-酷酷的女生头像


怎么考幼师资格证-热干面怎么吃



本文更新与2020-12-09 20:51，由作者提供，不代表本网站立场，转载请注明出处：https://www.bjmy2z.cn/gaokao/479440.html

返回列表：高中公式大全

网页设计之滚动字幕教案的相关文章

网页设计之滚动字幕教案随机文章
网页设计之滚动字幕教案热门标签