1、第二十三讲 Fireworks入门,网页制作,2,Fireworks 概述,Fireworks是第一个为网页制作而设计的图像处理软件，能使图像以最简洁的方式在网页中显示出最好的效果，它最为突出的功能是可以导入多种格式的图像文件，包括Macintosh的PICT文件，Freehand、Illustrator和CorelDraw等软件制作的矢量文件，Photoshop编辑处理过的PSD文件以及常用的GIF、JPEG、BMP和TIF等格式的文件，甚至还可以导入ASCII码的TXT文本文件，而且Fireworks 还可以辨识矢量文件中的绝大部分标识和Photoshop文件中的图层。作为一款专门为网页制
2、作而设计的图像处理软件，Fireworks 卓越的切割和优化导出功能使得用户可以直观简便地找到图像质量与下载速度之间的最佳平衡点。,3,Fireworks 的工作环境,Fireworks 的工作界面主要有标题栏、菜单栏、工具箱、文档窗口、浮动面板和属性面板组成。1. 菜单栏2. 状态栏3. 工具箱4. 文档窗口5. 属性面板6. 浮动面板,4,Fireworks 中的工具种类齐全，使用这些工具，您可以在单个文件中创建和编辑矢量和位图图形、设计网页效果、修剪和优化图形以减小其文件大小以及通过使重复性任务自动进行来节省时间。在“工具”面板中，绘制和编辑矢量图与位图的工具分别位于不同的部分，在 Fi
3、reworks 中，选择的工具决定了创建的对象是矢量图还是位图,图像处理,5,矢量图形使用称为“矢量”的线条和曲线（包含颜色和位置信息）呈现图像。例如，一片叶子的图像可以使用一系列描述叶子轮廓的点来定义，如左图所示。叶子的颜色由它的笔触的颜色和该轮廓所包围的区域填充的颜色决定。 位图图形由排列成网格的称为“像素”的点组成。计算机的屏幕就是一个大的像素网格。在叶子的位图版本中，图像是由网格中每个像素的位置和颜色值决定的。每个点被指定一种颜色。在以正确的分辨率查看时，这些点像马赛克中的贴砖那样拼合在一起形成图像，如右图所示。,矢量图形 位图图形,图像处理,6,“选取框”工具 用户要对位图图像的局部
4、进行编辑时，首相要创建相应的选区。“选取框”工具可以用来创建矩形选区和圆形选区。 鼠标左键按下“选取框”工具，在打开的列表中选择创建选区的形状，如左图所示。单击按钮或按钮，在画布中按下鼠标左键拖动，就可以创建相应形状的选区，用黑白虚线表示，如右图所示。,“位图”工具,7,在已经创建一个选区的前提下，选择“选取框”工具，按住键盘“SHIFT”键绘制选区，可以将选区组合在一起，如左图所示。如果按住键盘的“ALT”键绘制选区，可以在原选区里减去两个选区相交叉的部分，如右图所示。,“位图”工具,8,“多边形套索”工具创建的选区要比“套索”工具精确，所以也是比较常用的创建不规则选区的工具。“多边形套索”
5、工具是通过若干直线组成的多边形创建选区。单击按钮，在图像边缘多次单击鼠标左键创建选取，如图所示。,“套索”工具,9,“魔术棒”工具也是一种创建选区的工具，它可以将相邻的具有相同颜色和相似颜色的区域创建为选区。单击按钮，在位图图像上单击左键，位图图像中颜色相同或相似的区域都被选中，如左图所示。 选中“魔术棒”工具，打开“属性”面板。在“属性”面板中可以设定“容差”值，如右图所示。,“魔术棒”工具,10,“刷子”工具和“铅笔”工具都是在位图图像上绘制线条的工具。“刷子”工具绘制的线条比较圆滑，种类繁多，“铅笔”工具绘制的线条比较生硬。单击按钮或按钮，在画布上按住鼠标左键拖动绘制线条，如左图所示。
6、选中“刷子”工具，打开“属性”面板，可以更改刷子的样式，如右图所示。,“刷子”工具和“铅笔”工具,11,使用刷子工具编辑位图图像,使用刷子工具绘图的具体操作步骤如下。(1) 选择工具箱中的【刷子】工具。(2) 在图像中按住鼠标左键拖曳即可在图像上绘制出线条。选择【窗口】|【属性】命令，打开【属性】面板，在面板中显示【刷子】工具的相关参数。在【属性】面板中可以进行如下设置。【笔触颜色】：单击【颜色】按钮，在弹出的颜色框中设置刷子的【颜色】。在其右边的文本框中设置刷子的【大小】。单击其右边的列表框，在弹出的菜单中设置刷子的【描边】种类。【纹理】：在该选项的下拉列表中可以选中要使用的各种纹理选项。,
7、12,“橡皮擦”工具用来擦除位图图像中的颜色，与现实中的橡皮是同样的作用。单击按钮，在画布上按住鼠标左键拖动，擦除位图上的颜色，如左图所示。 选中“橡皮擦”工具，打开“属性”面板，在“属性”面板中可以设定橡皮擦的大小、形状、边缘和透明度，如右图所示。,“橡皮擦”工具,13,在“模糊”工具里含有“模糊”工具、“锐化”工具、“减淡”工具、“烙印”工具和“涂抹”工具五项。鼠标左键按下“模糊”工具，在打开的列表里选择，如左图所示。 “模糊”工具可以将图像变得柔和，降低像素之间的反差，使图像产生模糊效果。单击按钮，在需要修饰的区域按住鼠标左键拖动涂抹，如右图所示。,“模糊”工具,14,在“橡皮图章”工具
8、里含有“橡皮图章”工具、“替换颜色”工具和“红眼消除”工具。鼠标左键按下“橡皮图章”工具，在打开的列表里选择，如左图所示。 单击按钮，在舞台单击左键定义克隆的起点，然后将鼠标指针移动到目标位置按下左键拖动，开始复制，如右图所示。如果要重新定义克隆的起点，可以按住键盘“ALT”键再左键单击新的起点。,“橡皮图章”工具,15,“滴管”工具可以在位图图像或颜色表中拾取所需要的颜色。单击按钮，打开 “属性”面板，在“示例”选项里选择选取1像素、3x3像素区域内的平均颜色值或5x5像素区域内的平均颜色值，如图所示。,“滴管”工具,16,在“油漆桶”工具里含有“油漆桶”工具和“渐变”工具。鼠标左键按下“油
9、漆桶”工具，在打开的列表里选择，如图所示。,“油漆桶”工具,17,使用红眼消除工具编辑位图图像,【红眼消除】工具可以消除数码相机照片中经常出现的红眼，使照片恢复正常的效果。使用【红眼消除】工具的具体操作步骤如下。(1) 打开图像文件，选择工具箱中的【红眼消除】工具。(2) 在【属性】面板中设置相应的属性。(3) 将鼠标指针移动到红眼上，进行拖动，即可消除红眼。,第二十四讲 应用矢量对象,网页制作,19,编辑矢量图形,对于一次绘制的图形，很难符合要求，所以经常需要对其进行编辑修改。编辑矢量图形之前，需先选取要修改的图形对象，在Fireworks 中，主要使用【指针】工具、【选择后方对象】工具和【
10、部分选取】工具。1. 选取单个对象2. 选取多个对象3. 选取被遮挡的对象,20,“直线”工具“直线”工具用于在画布中绘制直线。单击按钮，在画布上按住鼠标左键拖动，可以绘制出直线，如图所示。如果在绘制线条的同时按住键盘“SHIFT”键，可以绘制出水平、垂直或倾斜45度的直线。,“矢量”工具,21,在“钢笔”工具里含有“钢笔”工具、“矢量路径”工具和“重绘路径”工具三项。鼠标左键按下“钢笔”工具，在打开的列表里选择，如图所示。,钢笔工具,22,Fireworks 有许多矢量对象绘制工具。使用这些工具可以绘制矩形、椭圆形和多边形这些简单的基本形状，也可以绘制“自动形状”，它们是矢量对象组，具有可用
11、于调整其属性的特殊控制点。鼠标左键按下“矩形”工具，在打开的列表里选择要绘制的图形，如左图所示。 绘制矩形和椭圆图形，选择按钮后直接在画布上按住鼠标左键拖动，即可绘制出相应的形状。如果在绘制的同时按住键盘“SHIFT”键，可以绘制出正方形和正圆，如右图所示。,“矩形”工具,23,在“自由变形”工具里含有“自由变形”工具、“更改区域形状”工具和“路径洗刷”工具三项。鼠标左键按下“自由变形”工具，在打开的列表里选择，如左图所示。 使用“自由变形”工具可以直接对矢量对象执行弯曲和变形操作，可以推动或拉伸路径的任何部分而不管点的位置如何。Fireworks 在更改矢量对象的形状时自动添加、移动或删除路
12、径上的点。单击按钮，打开“属性”面板，在“属性”面板里可以更改指针的大小，如右图所示。,“自由变形”工具,24,“刀子”工具可以用来切割路径，将一个完整的路径切分成两个或多个路径。单击按钮，在画布里按住鼠标左键拖动，经过矢量图形画出一条切线，将路径切割，如左图所示。松开鼠标，路经被切开，在切口处自动添加节点，如右图所示。,“刀子”工具,25,在Fireworks中提供了“接合”、“拆分”、“联合”、“交集”、“打孔”和“裁切”六种路径修改命令。首先在画布里绘制多个路径，如左图所示。 “接合”命令可以将多个路径合并成为一个路径。选中画布里的多个路径，单击“修改”，选择“组合路径”-“接合”，将路
13、径组合在一起，如右图所示。,组合路径,26,选中画布中的对象，单击按钮，光标移动到黑色矩形句柄上，按下鼠标左键拖动，可以更改对象的大小，如左图所示。光标放在对象边框外面按下鼠标左键拖动，可以旋转对象，如右图所示。,对象的变形和修改,27,选中任意绘制路径的工具，以“钢笔”工具为例，打开“属性”面板，在“属性”面板里设置笔触的属性，如左图所示。 单击“描边种类”按钮，在打开的列表里选择笔触路径的形状，如右图所示。,笔触的使用,28,选中绘制任意矢量图形的按钮，以“矩形”工具为例，打开“属性”面板，在“属性”面板里设置填充的属性，如左图所示。 单击“填充类别”按钮，在打开的列表里选择矢量图形的填充样式，如右图所示。,填充的使用,网页制作,教师：李金双Email：sy_,
