网页制作技术第二版许莉09.任务九处理网页图像.pptVIP

网页制作技术（第二版） 主编 许莉 中国水利水电出版社 网页设计与制作 学习目标 掌握在Fireworks CS4中位图的选取以及修饰的方法 了解元件与实例的概念与使用方法 了解交互式网页图像的概念 掌握图像的优化与导出的方法 掌握在Fireworks CS4中创建动画的方法 掌握切片和热点的创建方法 掌握按钮和导航栏的制作方法 掌握弹出菜单的制作方法 本章结束 馋死 尚辅网 / 任务九 处理网页图像 任务九 处理网页图像 目录： 知识1 位图图像处理 知识2 元件与实例 知识3 交互式网页图像 知识4 图像的优化与导出 任务1 打开多个图像文件制作动画 任务2 手工制作动画 任务3 分散到状态生成动画 任务4 利用元件和实例制作动画 任务5 导出动画 任务6 创建图像的切片与热点 任务7 制作按钮和导航栏 任务8 制作弹出菜单 任务九 处理网页图像 知识1 位图图像处理 位图的选取 位图是由像素构成的，如果要对位图进行编辑，可以对其像素进行操作。选择像素就需要使用位图工具箱中的的选区工具对位图进行选择。 1）选择规则选区 规则选区是指矩形选区或椭圆形选区。如图所示。 2）选择不规则选区 如果要选择一些不规则的区域，可以使用“套索”工具、“多边形套索”工具或“魔术棒”工具。如图所示。 知识1 位图图像处理 2）调整选区 增加选区的方法是：按下Shift键继续选择其他的选区。减少选区的方法是：按下Alt键选择需要删除的选区。 扩充与收缩选区的方法是：选择菜单【选择】|【扩展选取框】或【选择】|【收缩选取框】，然后在对话框中设置需要扩展或收缩的像素值即可。 要选择一个选区的边框，可以选择菜单【选择】|【边框选取框】，在对话框中输入边框的宽度即可。 要使选区边缘的线条更加平滑，可以选择菜单【选择】|【平滑选取框】，在对话框中输入取样半径，值越大，对原有细节的保留越少。当需要选择图像中颜色相似而又不连续的区域时，可以先选择一个区域，然后选择菜单【选择】|【选择相似】，即可选中所有区域。 当需要选择当前选区相反的区域时，可以选择菜单【选择】|【反选】。 羽化是指使像素选区的边缘模糊。选择一个选区，然后选择菜单【选择】|【羽化】，在对话框中设置羽化半径的像素值即可。 当需要选择图像的全部时，可以选择菜单【选择】|【全选】，或按快捷键“Ctrl+A”。取消当前选择，可以选择菜单【选择】|【取消选择】，或按快捷键“Ctrl+D”。 知识1 位图图像处理 位图的修饰 1）使用“铅笔”与“刷子”工具 2）使用“橡皮擦”工具 3）使用“模糊”、“锐化”、“减淡”、“加深”与“涂抹”工具 4）使用“橡皮图章”、“替换颜色”与“红眼消除”工具 知识1 位图图像处理 位图特效 Fireworks中所有的滤镜命令都集中在滤镜菜单中，通过滤镜可以制作出很多特殊的效果。滤镜效果既可以在滤镜菜单中选择，也可以在属性面板中设置。如图所示，就是属性面板中的滤镜选项。 知识1 位图图像处理 1）查找边缘与转换为Alpha 2）斜角和浮雕 3）杂点 4）模糊 5）调整颜色 6）锐化 7）阴影和光晕 8）Photoshop动态效果 知识1 位图图像处理 位图蒙版 蒙版效果一般由两个对象组成，位于上层的对象会对下层对象产生一个剪切的效果，也就是透过上层对象的形状看到下层对象的内容。Fireworks位图蒙版不管是使用其灰度外观还是使用其自身的透明度，都可以更改其应用方式。 1）使用“粘贴为蒙版”命令遮罩对象 首先导入一幅位图，然后绘制一个椭圆，让椭圆覆盖在位图之上。如图所示。选中位图图像，选择【编辑】|【剪切】，然后选中椭圆，选择【编辑】|【粘贴为蒙版】即可。此时，可以看到图像的颜色已经受到椭圆的颜色的影响而发生了变化。 知识1 位图图像处理 2）使用“粘贴于内部”命令遮罩对象 “粘贴于内部”命令会直接将位图粘贴到椭圆的内部，位图的颜色不会发生变化，如图所示。 3）将文本作为蒙版 将文本作为蒙版，与将矢量图形作为蒙版的操作方法一致，如图所示，就是使用“粘贴于内部”命令得到的效果。 知识1 位图图像处理 4）使用“层”面板遮罩对象 首先导入一副位图，然后在图层面板点击“添加蒙版”按钮，在蒙版层中，使用选框工具绘制一个椭圆，然后用刷子工具将椭圆全部刷满，这时可以在图层面板看到蒙版图层中使用刷子工具后的缩略图。如图所示。 再导入一副位图，将其放置到图层下方，调整位置，就可以看到图层蒙