简单的网页制作(二).docVIP

教学课题 表格布局和网页中添加动态效果 所用教材 教材名称：　中学信息技术（初中） 　第　全 册，第　5　章　3、4　节，第　1　课时 课时安排 1课时 教学用具 教学目标 知识与技能 学会使用表格进行网页的布局 学会如何在网页中添加动态效果 过程与方法 能对自己做过的作品进行加工和组织 情感态度与价值观 激发和保持对信息技术的求知欲，形成积极主动地学习和使用信息技术、参与信息活动的态度。 教学重点 表格属性的设置 滚动字幕的添加、动态HTML效果的添加 教学难点 动态字幕的添加 教学方法 任务驱动教学 板书设计 让学生新建自己的文件夹命名规则为“班级座号姓名” 学校ftp地址及其用户名和密码，方便学生上交作业 教学过程及内容 教学环节 教学内容 处理方式 设计意图 情境设置 大家打开上次自己做的网页，再看看我们上网别人的网页，有什么明显的不一样吗？ 布局比较乱对吗？看起来不整洁。还有就是没有动态效果，插入的图片文字什么的都是静态的，看起来没那么生动对吗？ 这节课我们就来完善一下我们的作品，学习利用表格来对网页进行布局，还有怎么样在我们的网页中添加动态的效果 对比学生上节课的网页和其他星座网网页 引发学生兴趣，创设的问题能让学生很快进入课堂氛围 新知探究（15分钟） （一）如何插入表格： （1）将光标移到你要插入表格的位置，即插入点。 （2）单击【表格】菜单，选择【插入】选项，并在选择项中单击【表格】选项，出现插入表格对话框。 （3）在对话框中，在“行数”输入需要的行数，这里我们要做星座网的首页，所以就设为2行，在“列数”输入需要的列数为6，同时设置好“对齐方式”、“边框粗细”、“单元格边框”、“单元格间距”。 （4）最后单击【确定】按钮，屏幕上就会出现一张空的表格。 很多时候，我们要在一张表格中插入另一张表格，其做法与前面所介绍的插入表格操作并没有太大的区别，只是在插入表格之前应该把插入点定位在单元格内。利用这种做法，我们将可以制作出非常复杂却符合我们要求的表格来。 （二）设置表格属性 （1）在表格元素被选定后，才能修改单元格属性、表格属性、复制和删除等操作。 （2）选定表格后，右击鼠标，选择【表格属性】，弹出表格属性对话框 （3）这里我们可以设置表格的布局、边框、背景等属性，现在我们插入的表格只是用来帮助我们布局，可以把边框粗细设置为0，在编辑状态，我们可以看到边框变成了虚线，预览的时候，边框看不到了。 （4）我们也可以对它进行背景的设置，可以设置背景颜色，也可以添加背景图片 （三）设置单元格属性 （1）选定要设置属性的单元格（如果只须设置某个单元格的属性，只需将光标移到该单元格内，无需选定该单元格） 演示操作 演示操作 教学过程及内容 新知探究（15分钟） （2）右击单元格，选择【单元格属性】，单元格属性的设置与表格类似 （3）如果说我们刚才插入的行数和列数想更改的话，我们可以拆分单元格或者合并单元格，同样是右击单元格，然后选择拆分或是合并。也可以插入行或列 （四）在表格中插入文字或图片 在表格中我们可以插入文字或者图片，这个同学们都会了，就不重复了。 （五）滚动字幕的添加 很多时候我们进入一个网站的首页，会看到网页的上边会有类似“欢迎你”之类的滚动字幕，那滚动字幕我们是如何添加的呢？ 也许很多同学会先在网页中输入文字，然后选中它们，单击右键，想找下有没有可以设置成滚动字幕的选项，我们不妨试试。发现没有。那要怎么做呢？ （1）单击菜单中的【插入】，选择【组件】，这里我们看到有【字幕】这个选项，选择它，然后设置字幕属性 （2）输入滚动字幕的内容，方向速度以及表现方式我们可以自己选择设置，还可以设置字幕的背景颜色等 （3）那字幕的字体要怎么设置？我们插入字幕后，选中字幕，然后和普通的字体设置一样，我们在工具栏中选择字体、大小、颜色等 （4）滚动字幕的滚动范围我们可以拖动进行调整 （六）动态HTML效果的添加 大家可能有见到过这样的一种效果，当我们把鼠标悬停在某一张图片上的时候，图片变成了另外一张图片，这就是动态HTML效果中的一种，怎么做的呢？ （1）选中图片，单击菜单中【格式】，选择【动态HTML效果】 （2）选择一种效果开启方式【悬停】，用于交换图片，然后选择交换后的图片 （3）文字也可以添加动态HTML效果，选中文字，然后同样选择【格式】中的【动态HTML效果】，选择一种鼠标事件，对格式进行更改，然后修改字体 （4）预览效果 提出问题 演示操作 演示操作 激发学生的思考及求知欲 教学过程及内容 即时体验（30分钟） 把ftp上自己之前做的网页下载到自己电脑，存放到自己电脑当中，然后让学生完善自己的作品 学生进行实践，教师适当地引导学生，学生做好后保存 帮助学生巩固所学知识