第三章 简单网页的形成 3.3链接.docVIP

第三章 简单网页的形成 课题： 链接（3.3） 教学分析与准备 1．教学任务链接的基本设置 各种网页间链接设计的习惯安排 链接的美化 2. 教学重点 链接的基本设置 3. 教学难点 链接的美化 4. 教学策略 任务驱动学习和协作学习、探究学习相结合 5. 教学环境 多媒体网络教室 6．建议课时数 8节 三、学习过程 教学环节及手段 教学内容 备注 组织课堂： 导入新课： 为网页设置链接功能，可以轻松进行网页间的切换 讲述新课： 讲授法 操作演示 讲解演示 讲解演示 讲解演示 提示 讲解，知识点扩充 讲授法 举例演示 提示 讲授法 举例演示 讲解演示 讲解演示 讲授法 举例演示 提示 课堂小结 师生问好 整顿课堂纪律，检查书本情况，准备进入教学。 任务 为网页设置链接功能 链接到另一网页 【操作步骤】 STEP 1 选择链接点。 STEP 2 鼠标左键单击“插入”菜单，单击“超链接”，将出现“插入超链接”对话框。 STEP 3 在“地址（E）”后面填写正确的网页地址（选择要链接到的文件，或者直接输入要链接文件的路径和文件名），单击“确定”。 例14 建立网站“c:\《Internet应用》\第3章例题\link”，练习链接的设置方法。 具体操作： 1．鼠标单击“文件”，单击“新建”，单击“由一个网页组成的网站”，选择“空白站点”，在“指定新站点的位置”一栏中输入“c:\《Internet应用》\第3章例题\link”，单击“确定”。 2．建立四个页面，主页为index.htm，三个分页面分别为1.htm、2.htm、3.htm。 （1）index.htm 网页标题为“超链接”； 第一行标题设为隶书、蓝色、7号字、加粗、居中，文字前插入图片link.gif； 背景图片设为bg.gif。 从第二行开始的所有文字设为楷体、蓝色、5号字、字符间距设为扩充、间距大小为10、左对齐、文本之前缩进200、双倍行距； 使用多级编号：选择从第二行开始的所有文字，鼠标左键单击“格式”，单击“项目符号和编号”，出现“项目符号和编号方式”对话框，选择“编号”选项卡，选择所用编号的样式；单击“样式”，出现“修改样式”对话框，单击“格式”按钮，在出现的下拉式菜单中单击“字体”，在“字体对话框”的“字体”选项卡中将颜色改为蓝色，单击“字体对话框”中的确定，单击“修改样式对话框”中的确定，单击“项目符号和编号方式对话框”中的确定。选择四至七行，单击“格式”工具栏中的“增加缩进量”按钮（注意：这四行的1、2、3、4是键盘输入的）。 保存文件 （2）1.htm 网页标题为“链接的设计”； 第一行标题设为幼圆、蓝色、5号字、加粗、居中； 背景图片设为“从另一网页获得背景信息”，网页名为index.htm。 第二、第四行为红色、加粗、居中，其他属性用默认值； 第三、第五至第九行左对齐、文本之前缩进200、使用默认的项目符号； 保存文件. （3）2.htm 网页标题为“链接的方法”； 第一行标题设为幼圆、蓝色、5号字、加粗、居中； 背景图片设为bg.gif。 输入“URL的四种情况”，插入一个四行四列、边框粗细为0的表格，将文字和图片输入到恰当的表格中，四幅图片的文件名从左至右依次为：Itss.jpg、Copy.gif、Clip.jpg、Mailbox.gif； 保存文件. （4）3.htm 网页标题为“链接的设计”； 第一行标题设为幼圆、蓝色、5号字、加粗、居中； 背景图片设为bg.gif。 第二、第四行为红色、加粗、居中，其他属性用默认值； 第三、第五至第九行左对齐、文本之前缩进200、使用默认的项目符号； 保存文件。 3．设置四个网页之间的相互链接。 方法一：一般的链接设置 （1）在每一页的最后一行输入文字“主页 链接的设计 链接的方法 链接的美化”； （2）将除本页外的三个标题链接到相应的网页。 方法二：利用导航栏设置链接 （1）显文件夹列表： 单击常用工具栏中的“切换窗格”按钮，选择“文件夹列表”，从“视图”菜单中亦可找到。 （2）选择导航页面： 单击“视图”菜单，选择“导航”。 （3）建立导航栏： 用鼠标左键拖动“文件夹列表”中的文件1.htm到导航页面，则在“超链接”下会出现“链接的设计”；同理，将2.htm和3.htm拖动到导航页面。 （4）在页面中插入导航栏： 双击“文件夹列表”中的文件index.htm，光标放在页面最后一行，单击“插入”菜单，单击“导航”，在出现的“插入Web组件”窗口中，选择“链接栏”中的“基于导航结构的链接栏”，点击“下一步”，选择“选择栏样式”，点击“下一步”，选择链接栏方向，点击“完成”按钮。在随后弹出的“链接栏属性”窗口中选择“子层”和“附加网页”中的“主页”； 同理，在另三个页面的最后一行插入