第6 课用表格安排网页布局
教学目的：
1、会在网页中使用表格显示数据 2、利用表格安排网页布局。
教学重难点：利用表格安排网页布局。 教学方法：演示法 教学课时：共一课时 教学准备：
1、FrontPage软件、course文件夹、logo.gif图片一张。 2、调试每台计算机
3、打开计算机并由教师机控制 4、由各组组长带队有秩序地进电脑室 教学过程：
第一课时
一、引入
FrontPage的表格是一个很重要的功能。我们不仅可以利用表格显示数据，而且还可以通过调整表格中的单元格的大小，来改变放在单元格中的文本和图片的版面位置，网页的总体布局。
二、新授
活动一：在网页中使用表格显示数据
师：FrontPage的表格操作与Word的表格操作基本类似，主要有：表格的创建，行（或列）的插入或删除，单元格的拆分、合并、格式设置等。
做一做：制作“我的课程表”网页（course.htm），如图1所示。
教师演示操作，学生注意观察。
12
学生参照书P34-36页上的14个步骤，自行完成“我的课程表”网页（course.htm）设计。
学生上机操作，教师巡视指导。 展示完整的作品，评价小结。 活动二：利用表格安排网页布局。
师：FrontPage里不仅可以在表格中嵌套表格，还可以插入文字或图片。因此，我们可以利用表格来安排网页布局，设计出构图精美的网页。
做一做：用表格来安排“七巧板”网页布局，如图5所示。 分析：该网页的布局是由四个表格组成，在表格中嵌套表格。先建立一个3行一列的表格来布局整个网页。接下来在表格1的第一行再嵌套一个1行2列的表格，在表格1的第二行再嵌套一个1行5列的表格，最后在表格1的第三行嵌套一个2行1列的表格。
教师演示操作，学生注意观察。
学生参照书P38-39页上的11个步骤，自行完成“七巧板”网页布局设计。
学生上机操作，教师巡视指导。 小结。 三、想一想
在活动二中，只用一个表格可以完成如图5所示的布局吗？
13
第七课 让网页动起来
教学目标：1、在网页中添加字幕。
2、在网页中添加DHTML动态效果。 教学重点：运用滚动字幕、悬停按钮美化自己的网页。 教学难点：发扬探索精神，自主探究学习 教学过程：
一、作品展示，导入课题：
师（提问）：在前面我们大家的共同探讨中大家是否已经对制作一个网页有了一个具体的思路呢？ 生（回答）：略
师：大家看一看教师的这个网页中有哪些元素是大家所没有接触过的？
生：运动的字！（欢迎参观我的校园）；那些显示的图片！；那些颜色可以改变的按钮！
师：这些元素的增加，大家感觉怎么样？ 生：很漂亮；有动感
生：老师，这些都是怎么加上去的呀？ 二、新课教学
1、在网页中添加字幕。
师：网页中常常有一些滚动的文字，我们称之为“字幕”。在
14
网页中添加字幕，如同在网页中插入图片。 教师操作演示：（1）打开主页；
（2）将光标移到网页的末尾，执行“插入”-“水平线”命令，插入一条水平线；
（3）将插入点光标定位在水平线的下一行；
（4）执行“插入”-“组件”-“字幕”命令，打开“字幕属性”对话框，在“文本”框中输入“欢迎光临笨笨熊之家，请多指教！”，单击“确定”按钮； （5）保存后，预览网页，观察字幕效果。
字幕的字体、字号、颜色、背景等设置操作与WORD的一样。 学生动手操作练习。
2、在网页中添加DHTML动态效果。
师：所谓DHTML动态效果，就是访问者在浏览网页的文字或图片时，随着单击鼠标或鼠标悬停或加载网页等事件发生，文字或图片就会相应地按设定的效果变化；事件消失，文字或图片恢复原样。
教学操作演示：（1）用图像处理工具将一张图片处理成黑白图效果，并存到主页所在文件夹下的images文件夹中； （2）打开做好的主页，选中图片；
（3）单击“格式”下拉菜单中的“动态HTML效果”命令，打开“DHTML效果”工具栏；
15
相关推荐：
loading