5_网站创建与网页制作.docVIP

课题序号 6 教学班级 1016 教学课时 4 教学形式 新授 课 题 名 称 任务四 图像的操作 使用教具 PPT课件 学案 教学目的 1.能够根据页面显示效果在适当位置插入图像元素。 2.能够对图像进行必要的修饰来美化页面的显示效果。 3.熟练运用Dreamweaver设置网页标题和网页背景 4.掌握图像超链接设置 教学重点 1.掌握图像的插入方法。 2.掌握图像的设置与修饰方法。 3.掌握图像对象的插入与设置。 4.掌握图像与文本混合编排的方法。 5.掌握与图像相关联的各种链接状态。 6.掌握制作图像导航条方法。 7.了解网页中与图像技术相关的特效处理技术。 教学难点 掌握图像的设置与修饰方法。 2. 掌握图像对象的插入与设置。 3. 掌握图像与文本混合编排的方法。 4. 掌握与图像相关联的各种链接状态 5. 掌握制作图像导航条方法。 更新补充 课前准备 教案、学案、课件 课外作业 完成任务 2.2.1 图像的插入与设置 板 书 设 计 任务四 图像的操作 1.掌握图像的插入方法。 2.掌握图像的设置与修饰方法。 3.掌握图像对象的插入与设置。 4.掌握图像与文本混合编排的方法。 5.掌握与图像相关联的各种链接状态。 6.掌握制作图像导航条方法。 7.了解网页中与图像技术相关的特效处理技术。 教 学 感 想 课堂教学安排 教学环节 主 要 教 学 内 容 教学手段与方式 复习导入 新授 I、复习导入 展示上节课学生的作业，复习知识点 II、新授 一、图像的插入与设置 1.出示本节课任务：《国兰文化》 页面制作 主要步骤：（1）打开站点“兰苑”。 （2）在本地站点中打开网页文件lan.html,把文件另存为lantu.html. (3)在“属性”面板上选择“页面属性”，选择“外观”选项，单击“背景图像”后的“浏览”按钮。选择背景图像image/bg.jpg. (4)将光标置于页面正文起始处，选择“插入记录-图像对象-导航条”命令，在首行插入导航条。 （5）表格外框选中该表格，在下方的表格“属性”面板将其对齐方式设置为“居中对齐”，填充为2. （6）将光标置于水平线下方起始处，选择“插入记录-图像对象-鼠标经过图像”对话框，设置相关信息。 （7）单击“确定”按钮后，图片lan02.jpg插入到页面指定位置，而图片lan01.jpg则需预览网页时鼠标经过的第一张图片时才能显示出来。 （8）”. (11)按F12键预览效果。 二、.问题探究-----认识图像 1.认识图像 GIF图像 JPEG图像 PNG图像 2.插入图像 使用“插入“菜单； 使用“插入”快捷栏； 使用面板组“资源”面板。 注意：文件名要用英文名或用拼音文字命名，不能用中文，否则预览页面时特别是背景图片根本无法显示。 3.图像属性 给图像命名 改变图像大小 改换图像 图像超链接 给图像加上替代文本 为图像定义样式 调用Fireworks编辑图像 设置图像边距 设置图像超链接的目标窗口 设置低分辨率图像 增加图像边框 对齐图像 4.其他图像元素 a.图像占位符 b.鼠标经过图像命令 c.鼠标经过图像行为 d.导航条 完成任务： 思考：制作导航条的前提条件是什么？ 三、知识拓展---图像超链接 1.建立图像超链接 方法：插入图像后在图像属性栏找到链接，输入链接文件的地址或点击指向文件。 任务： 制作图像映射 方法：在图片上选择热点选框工具选择映射的区域，在热点区域属性面板中设置链接的指向文件。 任务： 将光标置于页面最底部的链接“回到顶部”前，插入图片flag.gif,在属性面板中设置其大小为400*60px，替换文本“兰香四溢”，边框为5，绝对居中，水平边距为250.选择图片“属性”面板上的“矩形热点工具”，在图片flag.gif上划出矩形区域，在下方的“链接”文本框内输入“lan.html#lan2”. 思考：图像映射与图像超链接的区别。 III 课堂总结 文本和图像时网页元素中作重要的两个元素，美观的网页是图文并茂的。文本的效果对网页的整体效果影响较大，配合图片的恰当运用，使简单平白的页面氛围 IV课后作业 P58 2.4上机练习操作 （1）（2） 展示 出示任务，初步感知网页中图像的编辑。 教师演示操作 分组讨论 自主学习 学生操作