DreamweaverFlashFireworks网页制作三合一培训教程 第15章 使用Fireworks MX 2004处理网页图像

DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程第15课 使用Fireworks MX 2004处理网页图像w本章要点w具体要求w本章导读w上机练习DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程本章要点w图像的基本操作w绘制矢量图w编辑位图DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程具体要求w掌握选择对象的方法w掌握编辑对象的方法w掌握绘制矢量图的方法w掌握编辑位图的方法DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程本章导读w图像是网页中不可缺少的部分，Fireworks MX 2004在网页图像处理方面有着非常强大的功能，无论是矢量图还是位图，它都能够对其进行编辑和处理。熟练地使用绘图工具，是制作完美的、具有震撼力的网页图像的基础。n网页中的各种图像：产品图片、背景图片、按钮图片、广告图片。n各种标志：网站标志、各种小图标。n网页界面设计：网页首页设计、网站内容页面设计。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.1 图像的基本操作w在Fireworks中可以使用选择与变形工具对图像中的对象进行选择、移动、复制、删除、旋转、缩放或倾斜等各种操作。若同时选择多个对象，还可以进行堆叠、组合和对齐等操作。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.1 图像的基本操作w15.1.1 知识讲解w15.1.2 典型案例灯笼DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.1.1 知识讲解w图像的基本操作包括选择对象、编辑对象和组织对象三个方面的内容。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.1.1 知识讲解w1选择对象w2编辑对象DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1选择对象w在对绘图区域中的任何对象进行编辑操作之前，必须首先选择它。在选择时可以使用指针工具、选择后方对象工具和部分选定工具进行选择。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）使用“指针”工具w单击“工具”面板中的“指针”工具 ，然后执行下列操作之一可选择需要的对象：n单击需要选择的对象。n在绘图区域中拖动鼠标，划出一个矩形框，全部或部分框选要选择的对象，如果一次框选多个对象，可同时选择它们。n在“层”面板中单击要选择的对象。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）使用“选择后方对象”工具w用鼠标指针按住指针工具 不放，在弹出的工具列表中选择“选择后方对象”工具 ，然后在多个重叠的对象上连续单击，可以自上而下选择对象，这样便可选择被其他对象遮盖的对象。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程框选对象、在“层”面板中选择DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程3）使用“部分选定”工具 w单击“工具”面板中的“部分选定”工具 ，可以选择组合对象内部的对象或矢量对象上的部分点，其操作方法和“指针”工具相同。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2编辑对象w编辑对象，主要包括移动、复制、删除、变形、扭曲以及组合等操作。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）移动对象w可以使用以下方法移动对象：n使用“指针”工具或“部分选定”工具拖动选择的对象。n选择要移动的对象，按【Ctrl+X】快捷键剪切对象，然后单击其他图层或打开其他的文档，再按【Ctrl+V】快捷键将对象移动到其他图层或其他文档中。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）复制对象w可以使用以下方法复制对象：n按住【Alt】键不放，并使用“指针”工具或“部分选定”工具拖动选择的对象。n选择要复制的对象，按【Ctrl+C】快捷键复制对象，然后单击其他图层或打开其他的文档，再按【Ctrl+V】快捷键将对象复制到其他图层或其他文档中。n选择要复制的对象，再选择【编辑】【重制】或【编辑】【克隆】命令，可复制对象。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程3）删除对象w选择要删除的对象，再按【Delete】键或【Backspace】键即可删除所选对象。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程4）取消选择对象w在编辑窗口的空白处单击或按【Ctrl+D】快捷键可以取消对象的选择。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程5）变形和扭曲对象w用鼠标指针按住“缩放”工具 不放，在弹出的工具列表中可以选择“缩放”工具 、“倾斜”工具 和“扭曲”工具 ，各个工具的功能如下。n“缩放”工具 ：选择该工具后，拖动对象周围出现的控制点可放大或缩小对象。n“倾斜”工具 ：选择该工具后，拖动对象周围出现的控制点可倾斜对象。n“扭曲”工具 ：选择该工具后，拖动对象周围出现的控制点可移动对象的边或角，这有助于创建3D外观。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程变形工具DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程6）组合对象w在Fireworks中可以将多个对象组合成一个对象，以方便对它们进行整体操作。选择多个要组合的对象后，选择【修改】【组合】命令或按【Ctrl+G】快捷键可以将它们组合为一个对象。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程7）对齐对象w选择【修改】【对齐】命令，在弹出的子菜单中提供了大量的对齐命令，根据实际需要任选一种命令即可。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.1.2 典型案例灯笼w本案例将制作两串灯笼并排放置的效果图，主要练习对象的选择、移动、复制、变形以及组合等操作。w素材位置：【第15课素材15.1.2灯笼.png】w效果图位置：【第15课源文件15.1.2灯笼.png】w制作思路：n1）将素材中的灯笼缩小。n2）复制出多个灯笼。n3）将复制出的灯笼排列成为一串灯笼。n4）将所有的灯笼组合成一个对象，然后再复制出另一串灯笼。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程灯笼最终效果图DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程操作步骤w根据“制作思路”，本案例分为两大部分：第一步，制作第一串灯笼；第二步，复制第二串灯笼。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1制作第一串灯笼w具体操作步骤（请老师参照软件讲解）：DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2制作第二串灯笼w具体操作步骤（请老师参照软件讲解）：DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程案例小结w本案例制作了两串灯笼，在制作过程中主要进行选择、移动、复制、变形以及组合等操作，这些操作都是在使用Fireworks进行网页图像处理时必须使用的基本操作。本案例主要是为了让读者熟练掌握这些基本操作，为学习后面的知识打下坚实的基础。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.2 绘制矢量图w矢量图像对象是以路径定义形状的计算机图形，使用Fireworks MX 2004可以非常方便地绘制矢量图像对象。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.2 绘制矢量图w15.2.1 知识讲解w15.2.2 典型案例绘制一部手机DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.2.1 知识讲解wFireworks MX 2004提供多种绘制和编辑矢量对象的工具。使用这些工具可以快速绘制直线、圆、椭圆、正方形、矩形、星形以及路径等。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.2.1 知识讲解w1绘制矩形和正方形w2绘制圆角矩形w3绘制椭圆和圆w4绘制多边形星形w5绘制路径w6编辑路径w7设置矢量图形的属性DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1绘制矩形和正方形w单击工具箱中“矩形”工具 ，在绘图区域的空白处按下鼠标左键不放拖动鼠标，到达适当的位置后释放鼠标，可绘制出一个矩形。w在拖动时按住【Shift】键，可绘制出一个正方形。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2绘制圆角矩形w单击工具箱中的“圆角矩形”工具 ，在绘图区域的空白处，按下鼠标左键不放拖动鼠标，到达适当的位置后释放鼠标，可绘制出一个圆角矩形。n拖动圆角矩形中的黄色圆点可调整圆角的弧度。n单击圆角矩形中的黄色圆点可改变边角的形状。n拖动圆角矩形右下角的黄色圆点可调整图形大小。在拖动时按住【Shift】键，可绘制出一个圆角正方形。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程3绘制椭圆和圆w单击工具箱中“椭圆”工具 ，在绘图区域的空白处按下鼠标左键不放拖动鼠标，到达适当的位置后释放鼠标，可绘制出一个椭圆。若在拖动时按住【Shift】键，可绘制出一个正圆。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程4绘制多边形星形w在Fireworks MX 2004中可以绘制边数为325的正多边形，下面以绘制一个正八边形为例讲解，具体操作步骤如下：n1）单击工具箱中的“多边形”工具 ，并在其“属性”面板中的“形状”下拉列表中选择“多边形”选项，在“边”文本框中输入“8”。n2）在绘图区域的空白处，按下鼠标左键不放拖动鼠标，到达适当的位置后释放鼠标，可绘制出一个多边形。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程5绘制路径w路径是组成矢量图形的基本元素，通过钢笔工具可以绘制直线路径和曲线路径。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）绘制直线路径w使用钢笔工具绘制直线路径的具体操作步骤如下：n1）单击工具箱中的钢笔工具 ，在绘图区域中直线的起点位置单击鼠标。n2）将鼠标指针移动到直线路径的终点位置，再单击鼠标，在两点之间将绘制出一条直线。n3）将光标移动到其他位置再单击鼠标，可绘制出折线，在最后一个点上双击鼠标可完成绘制。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）绘制曲线路径w曲线路径是由线段和端点连接而成的，在端点上有两个控制柄，调整控制柄的位置和长度可以随意控制通过该端点的曲线曲率等属性，从而达到精确绘制任意曲线的目的。w使用钢笔工具创建曲线路径的具体操作如下：n1）单击工具箱中的钢笔工具 ，在绘图区域中曲线路径的起点位置单击鼠标。n2）将鼠标指针移动到曲线路径的下一个端点处单击并按住鼠标拖动，会出现曲线的控制柄。n3）重复第2步的操作创建出多个端点的复杂曲线路径，最后将鼠标移动到曲线路径起点的位置，当鼠标指针变为 形状时，单击鼠标将路径封闭路径。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程6编辑路径wFireworks提供了多种编辑矢量对象的方法。可以使用“自由变形”工具直接对路径进行编辑。还可通过联合、交集、打孔以及裁切等组合路径功能对多个路径进行编辑。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）使用自由变形工具w使用自由变形工具 可以直接对路径进行弯曲和变形操作。w单击工具栏上的“自由变形”工具 ，将鼠标指针移动到路径上，鼠标指针变为，拖动鼠标可以对路径进行拉伸。w将鼠标指针移动到路径内部或外部，当鼠标指针变为 时，拖动鼠标可以对路径进行推动。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程拉伸路径、推动路径DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）使用“组合路径”命令进行编辑w选择【修改】【组合路径】子菜单中的命令可以对多个路径进行操作。n联合：选择【修改】【组合路径】【联合】命令可以将多个路径对象合并成单个路径对象。n交集：选择【修改】【组合路径】【交集】命令可以从两个或多个对象的交集创建对象。n打孔：选择【修改】【组合路径】【打孔】命令将在处于下面的路径上减去处于最上面路径的内部的部分。n裁切：选择【修改】【组合路径】【裁切】命令将在处于下面的路径上减去处于最上面路径的外部的部分。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程“组合路径”命令编辑图联合交集打孔裁切DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程7设置矢量图形的属性w通过矢量图像的属性面板可以对矢量图像的填充、描边、不透明度以及效果等属性进行设置。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）设置填充效果w在填充类别下拉列表框中有“无”、“实心”、“网页抖动”、“渐变”和“图案”5个选项。n无：不进行填充，效果是完全透明。n实心：以一个单一的颜色进行填充，选择该选项后，单击 图标后面的颜色框，在弹出的颜色面板中可以设置填充的颜色。n网页抖动：以两种Web安全色交替进行填充，选择该选项后，单击 图标后面的颜色框，在弹出的网页抖动面板中可以设置交替显示的两种颜色。n渐变：以渐变颜色进行填充，当选择该选项时，将弹出一个选择渐变类型的列表，在其中选择一个渐变类型，然后单击 图标后面的颜色框，在弹出的渐变颜色面板中设置渐变的颜色。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）设置填充效果n图案：以一幅图案进行填充，当选择该选项时，将弹出一个选择图案的列表，在其中选择一个图案即可。要修改弹出图案可以单击 图标后面的颜色框，在弹出的图案面板中选择新的图案。w在“边框”下拉列表框中有“实边”、“消除锯齿”和“羽化”三个选项，含义如下：n实边：采用这种方法显示的图形的边缘会有锯齿效果。n消除锯齿：采用这种方法将效果图形边缘的锯齿消除。n羽化：将对图像的边缘进行羽化，选择该选项后，可以在其后面的文本框中输入羽化半径的大小。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）设置填充效果w在“纹理”下拉列表框中选择一种纹理，可以在填充的基础上再增加显示这种纹理，在其后面的文本框中可以设置纹理的透明度。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程填充效果图实边效果消除锯齿效果羽化效果添加纹理DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）设置描边效果w在描边种类下拉列表框中可以选择矢量图形边框的类型，其中种类非常多，除了一般的实线、虚线外还有各种特殊效果的边框类型，如“五彩纸屑”、“倾斜”和“有毒废物”等。w单击 图标后的颜色框，在弹出的颜色面板中可设置边框的颜色，在其后面的文本框中可设置边框的粗细。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程描边效果“五彩纸屑”边框类型“倾斜”边框类型“有毒废物”边框类型DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程3）设置透明度和其他效果w在 图标后面的文本框中输入一个小于100的值，可产生透明效果，以显示该图形下面的内容，当值为0时完全透明；在“混合模式”下拉列表框中可以设置该图形与其下面的图形的混合模式；单击“效果”后面的 按钮，可以为矢量图形增加一种滤镜效果。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.2.2 典型案例绘制一部手机w本案例将使用矢量工具绘制一部手机的效果图，主要练习绘制矢量图像以及设置矢量图像的属性等方面的操作。w效果图位置：【第15课源文件15.2.2手机.png】w制作思路：n1）使用矢量图像工具绘制手机的各个部分。n2）绘制完成后，设置手机各个部分的填充颜色和描边属性。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程手机最终效果图DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程操作步骤w根据“制作思路”，本案例分为两大部分：第一步，绘制手机的各个部分；第二步，设置手机各个部分的填充颜色和描边属性。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1绘制手机的各个部分w具体操作步骤（请老师参照软件讲解）：DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2设置手机各个部分的填充颜色和描边属性w具体操作步骤（请老师参照软件讲解）：DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程案例小结w本案例制作了手机效果图，在制作过程中主要用到了矢量图的绘制以及属性设置等操作。矢量图有很多优点，如进行缩放等编辑操作时，不会影响其质量，被广泛用于制作网页中的各种小图案、小图标、几何图案、线条和边框等，使用范围较广，需要多加练习掌握其操作方法。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.3 编 辑 位 图w位图是由称为像素的彩色小正方形组成的图形，这些小正方形就像马赛克中的瓷片那样拼合在一起形成图像。照片、扫描的图像以及用绘画程序创建的图形都属于位图。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.3 编 辑 位 图w15.3.1 知识讲解w15.3.2 典型案例设计嘟嘟手机网首页图像DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.3.1 知识讲解wFireworks提供了大量的动态效果可用于位图的颜色调节，还提供了许多修饰位图的方法，如修剪、羽化、重复或克隆等。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.3.1 知识讲解w1创建位图w2选取位图w3编辑位图DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1创建位图w要创建位图图像，可以用位图工具绘制，或将矢量对象转换成位图图像，也可导入外部位图图像。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）绘制位图w绘制位图的主要工具是“铅笔”工具 和“刷子”工具 。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程铅笔工具w使用铅笔工具可以绘制宽度为1像素的线条，单击工具箱中的“铅笔”工具 。然后将鼠标指针光标移动到绘图区域，拖动鼠标可绘制线条。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程刷子工具w用刷子工具 进行绘制时，可以创建出许多特殊效果，包括油画、水彩和蜡笔等效果。在其面板的“描边种类”的下拉列表中可以选择相应的效果。其绘制方法与铅笔工具相同。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程铅笔工具和刷子工具绘制的效果DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）转换矢量图形为位图图形w可以将矢量图形转换为位图图形，选择要转换为位图的矢量图形，再选择【效果】【平面画所选】命令可将选择的矢量图形转换为位图图形。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2选取位图w如果要对位图中的部分内容进行编辑，可以用选取框工具、套索工具和魔术棒工具进行选择。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）选取框工具w选取框工具包括“选取框”工具 和“椭圆选取框”工具 。n单击工具箱中的“选取框”工具 ，在绘图区域中拖动鼠标，可以建立矩形选区。n单击工具箱中的“椭圆选取框”工具 ，在绘图区域中拖动鼠标，可以建立椭圆的选区。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程建立选区图DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）套索工具w套索工具包括“套索”工具 和“多边形套索”工具 。n单击工具箱中的“套索”工具 ，在绘图区域中拖动鼠标，可沿着鼠标指针移动的路径建立一个选区。n单击工具箱中的“多边形套索”工具 ，在绘图区域中的不同位置单击鼠标，可建立一个多边形选区。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程使用“套索”工具建立选区使用“套索”工具使用“多边形套索”工具DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程3）魔术棒工具w使用魔术棒工具可以使图像中相邻的颜色相近的部分变为选区。单击工具箱中的“魔术棒”工具，在绘图区域中单击，在单击的位置周围颜色相近的区域都被选择了。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程 使用“魔术棒”工具建立选区DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程3编辑位图wFireworks MX 2004提供了大量的工具来编辑图像，如擦除位图、克隆像素、模糊、锐化和涂抹等。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）擦除位图w单击工具箱中的“橡皮擦”工具 ，在图形中拖动可以擦除图形中的内容，使擦除的部分变为透明。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1）擦除位图起始位置目标位置DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）克隆像素w使用“橡皮图章”工具 可以克隆位图的部分区域。当要修复有划痕的照片或去除图像上的灰尘时，克隆像素很有用。可以复制照片的某一像素区域，然后用克隆的区域替代有划痕或灰尘的点。w单击工具箱中的“橡皮图章”工具 ，在绘图区域中某一区域单击将其指定为源，在该位置处将显示一个 图标，这时当鼠标指针变为 时，将鼠标针移动到需要被覆盖的位置，然后拖动鼠标，可以将源位置处的内容复制到目标位置。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2）克隆像素DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程3）模糊和锐化w使用“模糊”工具 可以通过有选择地模糊元素的焦点来强化或弱化图像的局部区域。w使用“锐化”工具 可以修复扫描问题或聚焦不准的照片。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程4）涂抹w使用“涂抹”工具 可以对图形中的颜色进行涂抹。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程模糊、锐化和涂抹效果模糊效果锐化效果涂抹效果DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程5）减淡和烙印w使用“减淡”工具 可以减淡图像中的像素。w使用“烙印”工具 可以加深图像中的像素。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程6）替换颜色w使用“替换颜色”工具 可以选择一种颜色，并用另外一种颜色替换此颜色。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.3.2 典型案例设计嘟嘟手机网首页图像w本案例将制作嘟嘟手机网的首页图像，主要练习位图的导入、位图的编辑、将矢量图转换为位图等方面的操作。w素材位置：【第15课素材15.3.2】w效果图位置：【第15课源文件15.3.2嘟嘟.png】w制作思路：n1）导入“bj.jpg”图像，并进行处理，制作整个图像的背景。n2）导入“手机.png”图像，并进行处理，制作背景中的手机图像。n3）制作导航条。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程嘟嘟手机网首页图像DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程操作步骤w本案例分为两大部分：第一步，制作背景；第二步，制作导航条。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程1制作背景和手机w具体操作步骤（请老师参照软件讲解）：DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程2制作导航条w具体操作步骤（请老师参照软件讲解）：DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程案例小结w本案例制作了嘟嘟手机网的首页图像，在制作过程中主要用到位图的各种操作。在制作网页图像时会经常使用位图，设计网站页面、设计Banner、设计LOGO以及网页中的各种图形都离不开位图，熟练掌握位图的操作，才能够得心应手地处理网页图像。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.4 上 机 练 习w15.4.1 制作各种小图标w15.4.2 设计服装网站首页DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.4.1 制作各种小图标w本练习将制作各种小图标，在制作网页时经常需要使用各种小图标。矢量图标无论放大缩小还是修改颜色都非常方便，也不会影响图标的清晰度。本次上机练习主要练习矢量工具的使用。w效果图位置：【第15课源文件15.4.1小图标.png】DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.4.1 制作各种小图标w制作思路：n使用各种矢量绘制工具并结合“联合”、“交集”、“打孔”以及“裁切”等组合路径命令制作图标的外观。n在每个图标下会绘制一个圆，填充为红色，并将图标的颜色填充为白色。n将每个图标都组合为一个对象，然后进行排列和对齐操作，将它们排列整齐。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程小图标DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程15.4.2 设计服装网站首页w本练习将制作一效果图，主要练习文字工具、文字样式的设置等操作。w素材位置：【第15课素材15.4.2】w效果图位置：【第15课源文件15.4.2服装.png】w制作思路：n使用钢笔工具制作每个几何色块。n导入“女孩.jpg”图像，使用“魔术棒”工具选择周围的背景色，然后按【Delete】键将其删除。n导入“云.jpg”图像，为其添加“色相/饱和度”和“色阶”效果，并设置混合模式为“屏幕”，然后裁去不需要的部分。DreamweaverDreamweaver，FlashFlash，FireworksFireworks网页制作三合一培训教程网页制作三合一培训教程设计服装最终效果图