Fireworks MX 2004Fireworks MX 2004

教学内容教学内容 Fireworks 的功能很多，但是，因为课时数有限；有些功能，其他软件更强大，因此，教学内容是： §3.1 初识 Fireworks §3.2 熟悉常用控制面板 按钮、导航条、弹出菜单制作方法 图像优化与导出

用用 FireworksFireworks 制作导航条目的制作导航条目的 制作一个专门用于以下五张网页的导航（均放在同一目录之中）导航条，并导出相应的 5 张网页。即，

主页： index.html 个人简介： personal.htm 我的学校： school.htm 本人作品： writing.htm 自荐书： oneself.htm

用用 FireworksFireworks 制作导航条步骤制作导航条步骤 画布尺寸－ 750×30pt 新建按钮－“编辑” ·“ 插入” ·“ 新建按键”

依次制作－释放、滑过、按下 提示：提示：应用样式，不要外斜角、投影等外展样式，否则不易控制尺寸

将按钮元件， 5 次拖入文档窗口，然后在属性面板修改按钮上文字和设置链接目标

导出时，在“导出”对话框上单击“选项”按钮，进行相关设置后，导出一组一组网页

最后，用 DW ，修改网页文件名等

““导出”导出” ·“·“ 文档特定信息”选项卡文档特定信息”选项卡 “切片自动命名”选项区，选择用于自动命名切片的公式。

宜使用默认设置或选择自己的选项 “默认 ALT 标签”框中，可输入替代图像的描述文本 关键：关键：“多重导航栏 HTML 页面（在没有帧集的情况

下使用）”复选框，选中， Fireworks 将为导航栏中的每个按钮导出其它页面

考试题考试题 简述先利用 Fireworks 制作导航条后，导出一组多重导航栏 HTML 页面，然后在 Dream weaver 中，对该网页进行必要修改的主要操作步骤

答案－主要操作步骤答案－主要操作步骤 在 Fireworks 中，新建一个文档，将画布设置成所需的尺寸

新建一个按钮（元件），依次制作－释放、滑过、按下状态

将按钮元件，多次拖放到编辑窗口中合适位置 分别对每个按钮实例的“文本”和“链接”属性进行设置

导出一组多重导航栏 HTML 页面。注意，必须在“ HTML 选项”对话框的 ·“ 文档特定信息”选项卡上选中多重导航栏 HTML 页面（在没有帧集的情况下使用）”复选框

将该组网页作为一个站点，在 Dream weaver 中修改网页文件名和标题等

GIFGIF 动画制作动画制作 提示：提示： FW 制作的均是逐帧动画。按制作方法 逐帧制作

（新建）一帧一帧地编辑图形 创建所选的动画效果－对所选图形设定动画效果，在“动画”对话框上设定

多个图形分散到帧 将多个图形制作完成后－全部选中－单击“帧”面板“分散到帧”按钮

补间实例 两个（或更多）实例放置在画布上－全部选中－单击右键，然后单击“元件” ·“ 补间实例”－在“补间实例”对话框上设置

为热点（切片）添加行为 为热点（切片）添加行为 以制作介绍学院、系概况网页为例 具体步骤参阅－网页讲解 提示：提示：

背景图像－单独放置在一个图层（最底层）－设置为共享图层－不透明度在属性面板上设定

添加交换图像行为－每个热点对应不同的帧 为管理方便，将每个按钮图形与对应文字“组合”

网页层上放置热点、切片

功能简介功能简介 位图编辑－貌似 Photoshop 简化版。能与扫描仪、数码相机连接，工具少，处理功能弱

矢量图编辑－有一些独有的工具。如“路径洗刷”

文本处理－只有字符级一种文本（没有段落文本），也能应用样式

动画制作－实例才能制作简单动画。移动、缩放、旋转或淡入（淡出）

单步按钮制作程序单步按钮制作程序－很有用 弹出式菜单弹出式菜单－最有特色功能。可不写代码制作 创建翻转图片－与 Dreamweaver 功能相同 切片制作、设置应用－比 Photoshop 强大 图像优化图像优化－寻找文件尺寸与图形质量之间最佳点

对象类型与编辑模式对象类型与编辑模式 两类对象－矢量对象和位图对象

矢量－包含路径、文字、切片 文字与路径有所区别文字与路径有所区别－ “自由变形”工具可对路径进行变形，但不能应用于文字

使用位图区中的工具，不能编辑矢量对象 使用矢量区中的工具，不能编辑位图对象

工作环境工作环境 网页三剑客的工作环境基本相同

菜单栏、工具栏、文档编辑窗口、工具面板、属性面板和其它控制面板

工具面板－工具分六个区存放 选择、位图、矢量、网页、颜色和视图

属性面板－工具选项、文档或选区属性等 其它控制面板－作用与 Flash 相同 工具栏－主要和修改两部分

设置：窗口 ·工具栏 文档编辑窗口－包含优化输出效果预览

原始、预览、 2幅、 4幅等 4 个选项卡（视图）

工作界面工作界面

““工具”面板工具”面板 工具面板共有 58 个工具，分为六个区：

选择区、位图区、矢量区、网页区、颜色区、视图区

提示：提示： P84 ，工具面板图中显示了所有工具 P85 － 86 ，工具列表中只列出了主要工具 颜色区，用于设置颜色，不是存放工具

与其他软件“工具”类比与其他软件“工具”类比 选择区中

指针－相当于 Flash箭头、 P移动、 C挑选 裁切－相当于 P裁切－裁切尺寸属性面板设置 选取框－相当于 P 选框

位图区 选取框、椭圆选取框－相当于 P 选框

视图区中，五个工具与 P 的对应 单选按钮组－“标准屏幕模式”、“带有菜单的全屏模式” 和“全屏模式”按钮。选择显示模式

“手形”和“缩放”工具

视图视图 “视图”菜单中的命令主要与文档窗口有关

调整显示效果 标尺 网络－网格线的间隔、颜色等，在“编辑网格”对话框上设定

引导线－引导线的颜色、消除引导线，以及切片颜色、显示 /隐藏切片引导线，在“引导线”对话框上设定。

精确设定引导线，在“移动引导线”对话框设定

新建、打开文档新建、打开文档 新建文档

快捷键、“新建文档”对话框（宽度、高度是剪贴板中当前对象大小）等与 P类似

打开文档－两个复选框独特两个复选框独特 打开为“未命名”－选中打开后成为一个未命名文档，此后的编辑与原文档无关

以动画打开

导入、导出文档导入、导出文档 导入

将图形图像文件导入正在编辑的文档正在编辑的文档中 导入数码相机或扫描仪的图像

导出 将编辑成果以非非 PNGPNG格式格式文件输出 提示：提示：导出预览，可更改文件格式、品质等

快速导出 ““快速导出”按钮快速导出”按钮（位于文档窗口右上角）－可方便地进行查看比例、动画控制和文件导出

提示：提示：在主要工具栏上，有“导入”、“导出”按钮

文档格式文档格式 Fireworks 的文档格式－ PNG

Fireworks 编辑的是针对 PNG格式文档 打开非打开非 PNGPNG格式文档格式文档编辑时，将基于所打开的文档创建一个新的新的 PNGPNG格式文档格式文档

提示：提示：打开非 PNG 文档后，虽说文档窗口标题栏显示的是其他格式，但实际上编辑的是 PNG格式，保存时，以 PNG保存。如果，需要保存为其它格式（包括原格式），则须用导出方式

改变文档属性改变文档属性 提示：提示：所涉及的操作与 P “ 图像”菜单中图像大小、画布大小、旋转画布等命令相似

使用菜单命令－“修改” ·“ 画布”的次级菜单 图像大小 画布大小 画布颜色 修剪画布 符合画布 旋转 180° 旋转 90°顺时针 旋转 90°逆时针

使用属性面板－画布大小、图像大小

““参数选择”对话框参数选择”对话框 单击“编辑” ·“ 参数选择”，打开该对话框 常规－“工作区” ·“显示选项卡图标”复选框，选中，在文档窗口下方“状态栏”上显示面板显示面板按钮按钮

编辑 启动并编辑 文件夹 导入

““参数选择”参数选择” ·“·“ 编辑”编辑” 光标

精确光标－与 P 中精确光标相同（十字形） 刷子大小绘图光标－用刷子工具时，显示刷子大小的圆圈

“钢笔”工具选项 显示钢笔预览（作用与 P 是“橡皮带”相同） 显示实心点（路径节点全部以实心显示，而不是仅仅是选中的才是实心）

位图选项 关闭“隐藏边界” 显示条纹边框－显示位图边框

指针选项 鼠标高亮显示、拖动时预览、显示填充手柄、选择距离、对齐距离

操作的撤消与恢复操作的撤消与恢复 撤消

快捷键： Ctrl ＋ Z 。可以多次连续使用（键组合：与 P 、 C 相同；使用：与 C 一样，与 P不同）

恢复 快捷键： Ctrl ＋ Y 。可以多次连续使用（键组合：与 P 、 C 不同）

快速返回上次存盘状态－“文件” ·“还原” 历史面板－“窗口” ·“历史记录”

操作方法是，拖动左侧滑杆上的指示标志

属性面板（属性面板（ 11 ）） “属性”面板，是一个上下文相关的对话框，根据用户当前执行的工具或对象自动显示与之相关的属性，方便用户操作。

换句话说，当选择的工具或对象不同时，属性面板上显示的内容也不同。例如：

路径对象－属性面板分四个区。自左到右分别，设置尺寸（命名）、设置填充、设置笔触和设置透明度及样式。

属性面板（属性面板（ 22 ）） 文字对象－属性面板分三个区。自左至右分别，设置尺寸（命名）、设置文字属性、设置透明度及样式

位图对象－属性面板分二个区。自左至右分别，设置尺寸（命名）、设置透明度及样式

制作网站制作网站 LogoLogo 本节的目的是，通过制作 Logo

了解常用工具的使用方法及其功能 了解“修改”菜单中，“变形”和“组合路径”等使用方法及其功能

利用基本绘图工具直接绘制利用基本绘图工具直接绘制 第 2 步，文档属性－分辨率 37.7999 像素 /厘米，也就是 96ppi

第 6 步，显示网格，对椭圆对齐，没有什么作用，应该先选定需要对齐的对象，然后使用“修改” ·“ 对齐”次级菜单中命令

第 7 步，属性面板中轮廓线宽应是“ 2”

基本绘图工具与菜单命令结合基本绘图工具与菜单命令结合 第 6 、 7 步，均使用了“修改” ·“ 组合路径” ·“打孔”。

提示：提示：打孔的对象是位于“层”面板上最下方的对象

路径的绘制路径的绘制 线条－绘制直线－在文档窗口中拖曳

属性面板设置：线条颜色、笔尖大小、描边种类（笔触）、不透明度、混合模式、纹理名称及总量－与选项栏 Photoshop 相似

矩形、圆角矩形、椭圆、多边形 按 Shift正形；按 Alt起点为中心 提示：提示：取消组合后方可使用“自由变形”等编辑

钢笔、矢量路径－双击结束双击结束 功能及使用方法与 Photoshop 中“钢笔”、“自由钢笔”基本相同。区别：区别： Fireworks 中路径（线条）有宽度，且可以填充

提示：提示：上述路径工具的和属性面板相似

路径的编辑（一）路径的编辑（一） 通过编辑节点编辑节点变形路径

使用“部分选定部分选定”工具，操作方法类似于Photoshop 中 "直接选择 "工具。移动节点、拖动调整杆

提示：提示：删除节（锚）点的方法与 Photoshop 中不同，没有专门的删除锚点工具，只需选中后直接按 Delete 键即可。添加节（锚）点，用钢笔工具在路径上路径上单击

节点类型称为拐角节点（相当于 Photoshop 中尖角）和曲线节点节点（相当于平滑）类型转换类型转换的方法是用“部分选定”工具选中后，用“钢笔”工具单击或拖动

提示：提示：详见几种软件编辑方法对比

路径的编辑（二）路径的编辑（二） 使用变形工具组及刀子工具变形路径

" 自由变形 "工具：可直接弯曲路径不必修改节点。属性面板上，可调节变形半径和压力大小（压力越大，作用的范围越大－单击鼠标后出现的圆圈越大）

“更改区域形状”工具：可推拉路径，使之变形。属性面板上，“大小”是推拉变形范围（双层圆圈的直径），“强度”“文本框中输入一个范围从 1 到 100 的值。该值指示指针的潜在强度的百分比。百分比越高，强度越大（强度小了，拖不动路径）

" 重绘路径 "工具（钢笔工具组中钢笔工具组中）：用户可用它重画路径的局部。

“刀子（切割） "工具

路径的编辑（三）路径的编辑（三） 使用路径操作命令变形路径

路径混合－类似 C 中相交、修剪、焊接 路径简化－“简化”对话框上设定 扩展笔触－“展开笔触”对话框上设定 扩展与收缩路径－“伸缩路径”对话框上设定

变形扭曲对象 变形扭曲工具组位于工具面板的选择区中 注意：注意：可应用于文本、位图、热点区和切片区

提示：“修改” ·“变形”菜单命令组和“修改”工具栏上按钮命令也可利用

路径的编辑（四）路径的编辑（四） 为路径设置描边、填充、不透明度及效果

描边路径描边路径－笔触（“笔触选项”可设置描边位置，如，居中）、宽度、纹理、边缘（柔化度）

填充路径填充路径－填充类别（渐变样式－注意：注意：单击填充类型颜色框即可编辑）、边缘、纹理等

提示：提示：默认路径无色；有关设置在属性面板上进行；不封合的路径不封合的路径也能填充填充范围＝路径＋起点与终填充范围＝路径＋起点与终点边线点边线

设置不透明度设置不透明度－不透明度针对描边及其填充 设置效果－单击“效果”右侧的“＋”按钮后选择

路径的编辑（洗刷工具）路径的编辑（洗刷工具） “洗刷工具－添加”和“洗刷工具－去除”两种工具，用来更改路径的外观。使用不断变化的压力或速度，可以更改路径的笔触属性。包括笔触大小、角度、墨量、离散、色相、亮度和饱和度

提示：提示：有时上述工具的作用不明显 为了显示明显的效果，制作路径时，可选用描边种类－毛笔 ·羽毛笔

路径的组合路径的组合 “修改” ·“ 组合路径”的次级菜单命令

接合－可合并两个以上路径（层），（层），也可合并同一路径层上同时选中的两个节点（不一定重合）

拆分－只能拆分，由两个以上路径层合并而成的路径层

联合－类似 C焊接，填充色是下方下方路径的 交集－最上层的路径，裁切下方 打孔－成果是下方下方路径中减去与上方的重叠部分 裁切－最上层的分别裁剪下方的每每一个路径路径（结果只剩一个结果只剩一个）

提示：提示：交集、打孔、裁剪的原路径即使不闭合，“成果”“成果”都是闭合的

3.3.33.3.3 文本的创建与编辑文本的创建与编辑 文本框－固定、不固定宽度两类。可互换

不固定→固定－拖动文本框控制点 (除右上角 ) 固定→不固定－双击文本框右上角控制点

属性面板－编辑文字 字符设置字符设置－字体、字号、颜色、字型（加粗、倾斜、下划线）、字间距字间距（调节右侧间距，可单字调节）、字顶距字顶距（就是行距就是行距，单位 % 或像素。慎重设置慎重设置）、水平缩放、基线

段落设置段落设置－段落缩进（首行缩进）、段前空格（段前间距）、段后空格（段后间距）、文本排列方向（按钮）、段落对齐（五个按钮组合，齐行－“撑”满整行齐行－“撑”满整行）

提示：提示：在输入文字时，不应按下伸展对齐按钮不应按下伸展对齐按钮

3.3.33.3.3 文本编辑（二）文本编辑（二） 描边－文字、路径均可

宽度、位置（“路径外”）等设定。单击属性面单击属性面板笔触颜色框后板笔触颜色框后，在笔触选项对话框上进行

填充－与路径填充类似 填充类别（渐变样式－注意：注意：单击填充类型颜色框即可编辑）、边缘、纹理等

提示：提示：填充范围，就是正常的文字笔画部分 效果－

单击“效果”右侧的“＋”按钮后选择 提示：提示：应用一个以上样式时，应用先后影响最终效果（如，投影和凸起浮雕，选应用那一个）

文本编辑（三）文本编辑（三） 样式－与 P 中相同

“资源”面板，“样式”选项卡上选定 文本编辑器

单击“文本” ·“ 编辑器”，即可打开该对话框 “文本编辑器”对话框，能够编辑文本，功能与面板基本相同

3.3.43.3.4 变形文本、转换为路径变形文本、转换为路径 变形文本

利用工具箱中，选择区的变形扭曲工具组中的缩放、扭曲、倾斜工具

提示：提示：变形后，文本的大小（像素值）不变 将文本转换为路径

选中需要的文本后，单击“文本” ·“转换为路径”

提示：提示：转为路径后，不再能用编辑文本的方法 转换为路径后，改变字形方法见“路径的编辑（一）”

3.3.53.3.5 文本附加到路径文本附加到路径 与 C 的文本适配路径相比，功能强一些

文本与路径制作完成后，必须先选中两者必须先选中两者，然后再单击“文本” ·“附加到路径”

路径的绘制顺序决定文本的排列方向 文本适配到路径后，可利用：

文字属性面板上的文本排列方向（按钮）， “文本”菜单中的“对齐”和“方向的次级菜单命令，改变文本的排列、对齐方向等

路径与文本分离－“文本” ·“从路径脱离”

3.5.13.5.1 制作导航条制作导航条 制作导航条的关键是制作按钮元件

单击“编辑” ·“ 插入” ·“ 新建按钮”或者“编辑” ·“ 插入” ·“ 新建元件”后，在“元件属性”对话框选择

提示：提示：制作时，使用复制前一种状态图形的按钮，或从“公用”库中导入以简化制作工作

导航条须导出后，方可（插入网页）使用 保存类型－ HTML 和图像。这样才能插入网页

3.5.13.5.1 使用元件使用元件 元件的作用、制作、应用与 Flash基本相同。新建方法 单击“编辑” ·“ 插入” ·“ 新建按钮（元件）”

或在编辑窗口中单击右键，然后单击“插入新按钮（新元件、空位图”

元件种类－图形、动画和按钮。其中： 按钮的作用独特按钮的作用独特，例如，利用它可快速创建导航条（栏）。而导航条在网页是很重要的

动画－ GIF 动画是逐帧动画 提示：提示：元件尺寸＝图形＋样式范围。即，应用样式后，元件尺寸会比原图形尺寸大

3.5.13.5.1 按钮状态按钮状态 按钮的四种状态

释放－缺省状态，鼠标不在按钮上时的状态 滑过－鼠标在 Web 页中经过按钮时的状态 按下－单击按钮时显示的状态 按下时滑过－鼠标移至已按下按钮上的状态

提示提示 制作一个按钮至少有两种状态 按钮按下后，除非（网页）重新加载，否则，不会自动弹起（恢复至释放状态）

若将“按下时滑过”与“释放”设置相同，鼠标移至已按下的按钮上，能制作按钮弹起效果

3.5.13.5.1 创建按钮创建按钮 创建按钮－制作元件：按钮（ P176 － 17

8 ） 176 步骤 2 中，按钮由一个矩形和一个圆角矩形组合而成，是为了上部圆角，下部直角

释放状态制作完成后，滑过、按下、按下时滑过状态，均可用复制前一种状态图形，然后修改的方法制作

活动区域－在属性面板上设置链接目标等 提示：⑴提示：⑴按钮行为由单击（按下）单击（按下）事件引发 ⑵⑵四种状态中文本相同，不要将文本与图形组合，文本与图形组合，否则文本就不能单独编辑不能单独编辑了

⑶⑶按钮的样式不宜采用样式不宜采用－发光、投影、凸起浮雕、凹入浮雕、外斜角等，在按钮外侧显示的样式，否则导航条上各按钮不能紧密排列

3.5.13.5.1 编辑按钮编辑按钮 设置

“按下”和“按下时滑过”选项卡上，分别有：“包括导航栏按下状态”和“包括导航栏按下后滑过状态”复选框。应该选中应该选中（默认选项），以便此按钮适用于导航栏按钮适用于导航栏

进入编辑元件或实例状态 双击文档窗口中的（按钮）实例 双击库面板上的（按钮）元件 选中按钮元件，单击“修改” ·“ 元件” ·“ 编辑元件”

修改实例的文本对象或链接属性，可属性面板上进行

3.5.13.5.1 创建导航条创建导航条 导航栏－一组互斥的按钮 制作方法

将库中的按钮元件，重复数次拖入文档窗口，且排列整齐

逐个选中按钮在属性面板中修改“文本”、“链接”、替代“、”目标“等

导出 若要在网页中应用导航条，则必须必须使用导出的方法，保存为 HTML 文件和图像文件（ GIF ）

应用 在 Dreamweaver 中，插入 Fireworks HTML

3.5.13.5.1 系统提供的元件与按钮系统提供的元件与按钮 Fireworks 与 Flash 一样提供公用库。 “公用”库位于“编辑” ·“库”次级

“主题”是“按钮”、“动画”和“项目符号”等三类　元件的总和。还可使用“其他可使用“其他…”…”命令命令导入其他 PNG 文件中的元件

与 Flash 一样，从公用库中导入元件后，会保存到当前文档的库中

3.63.6 设计网页设计网页 3.6.1 ，第 8 步，制作圆环，填充色应该为无 提示：提示： 3.6.2 ，切片没有设置链接！而是待

到 Dream weaver 中再设置 3.6.3 、 3.6.4 和 3.6.5 ，分别设置优化；导出

HTML 和图像 3.6.6 ，讲述部分导出 PNG ，使用裁剪工具组中有“导出区域”工具，选定导出区域

提示：提示：所有图像素材，均在下述目录中： 教材素材 \ 本书素材与实例 \正文素材与实

例 \fireworks

5.25.2 使用样式使用样式 文字、图形、图像均可应用样式 使用样式的方法，及样式本身与 P 等相似

除了用户逐步添加（调整）外，也有样式面板 样式面板－使用、操作方法与 P 相似

默认有 30 个样式，保存在： Style Defaults.stl 目录： Program Files\Macromedia\Fireworks

MX\First Run\Styles 另有 21 个样式可添加：在 Styles.stl 文件中 目录： Program Files\Macromedia\Fireworks

MX\First Run\Nav Menu

5.45.4 编辑位图编辑位图 用户可以象编辑路径和文本那样，对位图进行选择、移动、复制和变形（缩放、倾斜、透视、旋转和翻转等）操作，也可利用属性面板为位图设置效果等

Fireworks MX 编辑位图的功能（除上述） 利用传统位图的绘图绘图工具－橡皮图章、铅笔等 利用滤镜滤镜增强图像效果。甚至使用 P滤镜 利用橡皮擦工具擦除擦除位图 羽化羽化图像边缘 利用模糊模糊、锐化锐化、减淡减淡、加深加深、涂抹涂抹处理位图 利用裁剪工具（选择工具区），裁剪裁剪图像

5.4.15.4.1 创建位图创建位图 “文件” ·“ 导入”，或直接打开位图文件 提示：提示：导入位图时与 C 一样，需用鼠标在文档窗口是拖动

利用复制、粘贴 选中矢量图形后，单击“修改” ·“平面化所选”

提示：提示：层面板菜单中也有此命令 用工具面板“位图”区中绘图工具直接绘制 单击“编辑” ·“ 插入” ·“空位图”，创建空位图

5.4.25.4.2 选区制作与调整选区制作与调整 选区制作工具

选取框、椭圆选取框、套索、多边形套索及魔术棒

使用方法 与 Photoshop 相对应的工具基本相同。属性面板设置相当于 P 中选项栏

调整选区 P141前三项，相当 P 中选区相加、相减、相交 后八项，与 P 中选择菜单的命令对应 提示：提示：用“选择” ·“保存位图所选”保存选区，只能保存一个，先进先出

5.4.35.4.3 －－ 77 绘制、编辑位图对象绘制、编辑位图对象 简言之，与 Photoshop 相似。但较 P 功能弱

Fireworks 中的滤镜含义与 Photoshop 有差异。它滤镜菜单中命令包含了 Photoshop中“图像” ·“调整”中的命令

Fireworks 中的滤镜菜单中命令在属性面板的效果菜单也能找到

选区中的图像选区中的图像可以使用“修改” ·“变形”次级菜单进行变形（扭曲）

提示：提示： Photoshop 6 和 7 插件与 Fireworkss MX 不兼容（ P148 ）

5.55.5 对象操作（对象操作（提示）提示） 在“修改”工具栏上有有关命令按钮

如，旋转 90°逆时针等旋转命令；组合；对齐和摆放顺序等

P148 － 5.5.1 标题，“移动……”多余多余 P150 －第一行应为：“按 Ctrl ＋ Shift ＋

DD”

5.5.1-25.5.1-2 选择、移动、复制与删除对象选择、移动、复制与删除对象 选择－指针工具，选择下方对象可在层面板上选 选择－ Shift辅助、用鼠标拖动圈定以及 Ctrl ＋

A快捷选择多个或全部对象 删除－选定对象后，按 Delete 键或退格键，也可按层面板删除按钮，或单击“编辑” ·“清除”

复制在原对象上方－选定对象后，按 Ctrl ＋ Shift＋ D （ P150P150错错）、或“编辑” ·“克隆克隆”

复制在原对象上方，略偏右下－选定对象后，（按 Ctrl ＋ Alt ＋ D ）、或“编辑” ·“ 重复重复”

提示：提示：注意克隆与重复之间的区别 其他与使用剪贴析有关复制的功能，详见 P150

5.5.35.5.3 对象层次、成组与对齐对象层次、成组与对齐 对象的层次调整－与 C 相似

在层面板上拖动 选中后，单击“修改” ·“排列”的次级菜单 选中后，单击“修改”工具栏上相应命令按钮

对象成组（合） 多个对象组合在一起（层），成组后，各对象的属性独立。且可单独设置填充等属性

对象对齐 选中对象后，单击“修改”工具栏上“对齐方式”按钮（组）中的相应按钮，或“修改” ·“ 对齐”的次级菜单

5.5.45.5.4 操作的撤消与恢复操作的撤消与恢复 利用历史记录面板

单击“窗口” ·“历史记录”，打开该面板。与P 、 C 的历史面板（卷帘工具）作用相同，操作方法略为不同，即，拖动左侧滑杆上的指针

编辑菜单 撤消、重复（恢复）命令，与 C 相同，可连续使用。

快捷键－重复快捷键是快捷键是 CtrlCtrl ＋＋ YY 、、撤消 Ctrl＋ Z

5.6.15.6.1 －－ 22 层、图层层、图层 层面板

与 C 的对象管理卷帘工具相似。既有图层，图层内包含对象

有一个网页层（包含创建交互Web 对象，如，切片）－该层不能删除（只能删除其中的对象）

图层操作 展开 /折叠、显示 /隐藏、锁定 / 解锁、设置当前、新建、复制、重命名、删除、调整顺序，以及将对象移动至其它图层

提示：提示：“命令” ·“ 文档”的次级菜单中的命令也是用于图层操作

5.6.35.6.3 不透明度、混合模式不透明度、混合模式 调整对象（子层）的不透明度、混合模式

选中子层后，在面板上部的下拉式列表框中设置。设置方法效果等与 P 相同。图形图像均可图形图像均可

5.6.35.6.3 蒙版功能蒙版功能 功能－与 Photoshop 对比

相同－蒙版上黑色区域黑色区域对应部分完全被隐藏完全被隐藏；白色区域白色区域对应部分完全显示完全显示；灰色区域灰色区域对应部分呈半透明呈半透明

不同－⑴蒙版是由一个对象（子层）转变而成的；转变过程中原彩色模式转换成“灰度”模式⑵“被蒙”对象上方无蒙版的部分被隐藏

蒙版与对象链接 与 Photoshop 一样层面板中蒙版与被对象之间有链接符号，单击即消失

编辑蒙版－与 Photoshop类似 选中蒙版后，工作标志框中显示蒙版标志

蒙版制作方法（一）蒙版制作方法（一） 创建蒙版组

选中作为蒙版（在上）和被蒙对象后，单击“修改” ·“蒙版” ·“ 组合为蒙版”

撤消蒙版－单击“修改” ·“取消组合” 通过粘贴方法

选中制作被蒙的对象→复制图像→“修改” ·“蒙版” ·“粘贴为蒙版”，复制的图像作为蒙版

创建空白蒙版 选中需添加蒙版的对象（子层）后，单击层面板上“添加蒙版”按钮

蒙版制作方法（二）蒙版制作方法（二） 蒙版的禁用（启用）

单击“修改” ·“蒙版” ·“禁用（启用）蒙版” 单击层面板上已被禁用的蒙版缩图，即可启用

删除蒙版 单击“修改” ·“蒙版” ·“删除蒙版”后，出现对话框，有放弃（不应用）、取消、应用三种选择

位图应用图形蒙版或位图应用位图蒙版－“删除前，应用蒙版到位图？”

图形应用位图蒙版或图形应用图形蒙版－“删除前，你想应用该蒙版吗？应用蒙版会将该对象和蒙版转换为单击位图图像。”

5.75.7 调整画布与图像尺寸调整画布与图像尺寸 与 Photoshop 中相似－对话框也类似

有关命令在“修改” ·“ 画布”的次级菜单中 画布大小－“锚定”与 P 中“定位”作用相同 图像大小－对话框设置与 P基本相同 画布颜色－调整画布颜色 修剪画布－将画布上空白部分裁剪掉。裁剪后的范围不可能比原画布大

符合画布－如果有对象超出画布范围，裁剪时，超出部分也将纳入画布范围。也就是裁剪后的范围可能比原画布大

画布旋转－没有旋转任意角度

第第 66 章重点内容章重点内容 切片与热点概念、创建、编辑方法

提示：热点的一些操作在 Dreamweaver已讲 为切片、热点附加行为－弹出菜单

输出带切片的文件－与热点基本相同 元件－最重要的是按钮－导航栏的基础 帧－帧 GIF 动画制作容易

重点－切片与热点重点－切片与热点 切片

将一幅图像（或“网页”）分割成多个将一幅图像（或“网页”）分割成多个独立部分独立部分

每个独立部分输出成一个独立图像文件 每个部分可以设置超链接等 提示：提示：切片有两种类型图像、 HTML

热点 在一整幅图像的某一个部分设置超链接 该部分就是（图像上的）热点

重点－切片与热点的区别重点－切片与热点的区别 为热点或切片附加行为的操作方法、效果相同。但所能添加的行为不完全相同 热点－交换图像行为、状态栏信息、弹出菜单 切片－简单变换图像行为简单变换图像行为、交换图像行为、状态栏信息、导航栏导航栏、弹出菜单

当图像（图形）不允许分割时，使用热点 图像（图形）分割后有利于下载

6.1.16.1.1 －－ 33 创建热点创建热点 热点－本人定义

作为超级链接源的图形图像，可以是整幅，也可以是其中的一部分

创建与设置热点 用某个热点工具，在图形图像上圈定热点范围或选中某个对象后，单击“编辑” ·“ 插入” ·“热点”

属性面板上设置热点“名称”、“宽度”、“高度”、“链接”、“形状”、“颜色”、“替代”、“目标”

编辑热点 利用指针、部分选定和几个变形工具可以改变热点的大小和形状

6.1.46.1.4 配置热点配置热点 利用拖放行为配置热点，以触发翻转效果

翻转效果－鼠标移至热点上，“跳出”一幅图像 在跳出另一幅图像处，创建一个切片创建一个切片 用指针工具将（圆形）热点标志，拖至相关的切片上，两者之出现一条链接的曲线。弹出“交换图像”对话框，在“交换图像自”框中选择后，单击“确定”（切片第一个关联，帧 2 是默认选择）

在“帧”面板，设置帧 编辑交换图像行为

在热点或切片上单击右键后，单击“添加交换图像行为”，在“交换图像”对话框上进行

6.1.46.1.4 例－提示例－提示 左侧创建切片也可以 右侧切片中，不同的交换图像必须放在不同的帧中。例如，对应“李进军”的放在第 2 帧中；那未其他人名对应的就不能再放在第 2 帧中了

例题中第例题中第 11 步操作是：拖动，比较简便步操作是：拖动，比较简便 交换图像应该放在切片中 提示：提示：在某个热点或切片上添加行为后，如果有错，最好是最好是，先将添加的全部行为删除，然后重新添加

6.1.56.1.5 配置、输出热点配置、输出热点 配置热点提示配置热点提示

实现在同一个切片（区）中，显示不同的图像的方法，是将不同的图像，作为不同的帧

帧－添加、删除、内容制作 “交换图像”对话框上

切片名称框对应切片预览框 交换图像来自－帧编号、图像文件（在切片显示一幅独立图像文件－但在文档窗口无法预览，需在浏但在文档窗口无法预览，需在浏览器中预览览器中预览）

输出热点－输出网页及其包含的图像输出网页及其包含的图像 图像－包含作为设置热点的图像和切片图像 “文件” ·“ 导出”命令

6.2.16.2.1 创建切片创建切片 使用切片和多边形切片工具创建切片

多边形切片由 JavaScript 定义，切片多脚本多 软件基于选中软件基于选中对象创建切片

选中对象后，单击“编辑” ·“ 插入” ·“ 切片” 选中多个对象，则需在对话框上选择

“单一”－将多个对象组合图形制作成一个切片 “多重”－每个对象对应制作一个切片

创建 HTML 切片－（表格单元格）文字 Fireworks 中有两类切片－图像、文字 在属性面板的“类型”框中设定“ HTML”

输出带切片的的文件－与导出热点相同

6.2.16.2.1 编辑切片编辑切片 察看切片

切片包含在网页层中 提示：提示：网页层显示关闭后，当前（单个）切片或热点的边界，仍可显示

改变切片形状（大小） 矩形切片－用指针或部分选定工具拖动引导线 椭圆、多边形切片－指针或部分选定拖动角点

切片命名 属性面板或层面板的网页层中进行

利用拖放行为配置切片 与热点的相应操作方法相同

6.3.16.3.1 切片或热点添加行为示例切片或热点添加行为示例 制作一个切片 选中切片，打开“行为”面板，单击“＋”按钮，然后单击“简单变换图像”

在“帧”面板上，添加第 2 帧，然后制作该帧上的内容

转到“预览”选项卡，就能预览到效果 为上述两帧设置共享层（如，底色）

新建图层 2 ，并在切片部位填充底色 将图层 2移至最下，单击层面板菜单按钮，然后单击“共享此层”－这是关键“共享此层”－这是关键

6.3.26.3.2 行为与事件行为与事件 行为行为－谓举止行动 ;指受思想支配而表现出来的外表活动

Fireworks MX 系统提供了多种行为。如，“交换图像”、“恢复交换图像”、“设置导航图像”及“设置弹出菜单”等

事件事件－有一定社会意义或影响的大事情 Fireworks MX 中的事件，指触发（诱导）行为的操作（如，鼠标经过）

提示：提示：事件是操作者的动作，行为是软件的反映动作。事件引发行为事件引发行为

6.3.36.3.3 切片或热点创建弹出菜单切片或热点创建弹出菜单 弹出菜单－可直接用弹出菜单－可直接用 DreamweaverDreamweaver 制作制作

指针滑过指针滑过网页对象（如切片或热点），或单击单击对象的行为，触发“弹出”的菜单事件

弹出菜单项可以附加 URL 链接实现导航目的 创建方法－可应用“修改” ·“ 弹出菜单”菜单 在切片或热点上右击后，单击“添加弹出菜单” 在“弹出菜单编辑器”对话框上设置

“内容”－添加（菜单）文本、 URL 、目标 提示：提示：弹出菜单级别设置与 PowerPoint 相似 “外观”－设定弹出菜单使用图像背景 “高级”－菜单单元格有关设置 “位置”－设置弹出菜单的位置（相对切片或热点）

提示－弹出菜单提示－弹出菜单 热点制作

先制作一个图形，应用样式后，选中后，单击“编辑” ·“ 插入” ·“热点”

“弹出菜单编辑器”对话框 高级选项卡上，如果设定和单元格宽度、高度，过小，软件会自动扩大，以适应菜单文字

行为设定－在“行为”面板上更改 默认默认用“鼠标滑过”“鼠标滑过”行为，触发弹出菜单事件

弹出菜单制作完成后，导出时 导出 HTML 和图像时，应该保存在保存在，将来要插入它的网页所在网站中。否则，插入网页后，可能不能正常运行。不要用中文命名不要用中文命名

例题－添加交换图像行为例题－添加交换图像行为 新建一个文件宽 750pt 、高 500pt

分三个部分：上－横幅、左－菜单、右－内容 上部“书写”横幅，且添加样式

用切片工具，在左侧制作 6 个切片，分别“书写”文字

在“帧”面板上，添加 6 个帧后，分别在 2－ 7 帧上，“书写”不同文字

回到帧 1 ，用指针工具依次选中左侧切片，然后拖至右侧切片上松开

在“交换图像”对话框“交换图像自”中框中依次选定不同的帧

6.56.5 创建简单创建简单 GIFGIF 动画动画 制作逐帧 GIF 动画

借助帧面板逐帧制作 帧延时（既该帧显示时间）修改，双击帧面板上帧名右侧单元格后，在帧延时框中设定

提示：提示：默认延时值为 7%秒，还可取消“导出时包括”复选框，即导出时，不导出该帧

制作成果导出成 GIF 动画格式图像文件 提示：⑴提示：⑴导出时优化面板上，“导出文件格式”框中，必须选定“必须选定“ GIFGIF 动画”动画”

⑵⑵若导出位图下方的“索引调色板”框中，应选定“精确”。即使这样导出的图像品质也不太佳

7.17.1 图像优化图像优化 图像优化

图像质量与文件尺寸的最佳匹配－兼顾双方 提示：提示：目前网络速度已经很快，文件尺寸已经不是最重要的了

“优化”面板 优化设置在“优化”面板上进行。除了“设置”框外， “导出文件格式”、“索引调色板”框也重要

7.2.17.2.1 图像导出图像导出 导出预览－单击“文件” ·“ 导出预览”

“选项”－与优化面板相似 “文件”－确定文件大小、缩放、导出范围等 “动画”－设置每帧延时、播放次数、启动导出向导等

导出向导－单击“文件” ·“ 导出向导” “导出向导”对话框－“目标导出文件大小”复选框，选中后可在下方的框中，设定导出文件的大小。向导会选择合理的优化方案，使导出的文件大小尽可能接近这个数值

提示：提示：若不熟悉优化和导出，可使用该向导

7.2.27.2.2 图像导出图像导出 导出的文件的保存类型

“导出”对话框，主要选项：保存类型（ 11种）、切片、 HTML 等选项不同，保存类型不同

优化面板上“导出文件格式”选项决定保存类型 导出区域选定

使用工具栏“选择”区的“导出区域”工具选定 导出文件－应保存在将来需插入的网站中应保存在将来需插入的网站中

HTML 文件－含用于重新装配所需 JavaScript及表，以及导出图像的链接信息

Spacer.gif 文件（ 1×1 像素GIF 文件）用于重新装配切片时，修复出现的间距问题

7.2.37.2.3 在在 DreamweaverDreamweaver 中中使用使用

Fireworks 制作的 GIF 、 JPG 或 PNG 文件，插入方法与普通图像文件一样

HTML 文件和图像插入方法－单击“插入” ·“交互式图像” ·“Fireworks HTML”

复制、粘贴方法 先在 Fireworks 中，单击“编辑” ·“ 复制

HTML 代码”，按向导提示，复制 HTML 代码，并将图像文件导出到指定文件夹，然后在目标网页编辑器中将代码粘贴到指定位置

在 Dreamweaver 中调用 Fireworks 优化图像 单击“命令” ·“ 在 Fireworks 中优化图像”

制作网页相册制作网页相册 Dreamweaver调用 Fireworks 制作网页相册

单击“命令” ·“ 创建网站相册” 在“创建网站相册”对话框上，用户指定

网页标题网页标题、副标题副标题、图像原存放目录图像原存放目录、图像插入图像插入网页后的存放目录网页后的存放目录、缩微图大小缩微图大小（几种固定尺寸中选定）、（网页上缩微图的）列数列数、缩微图格缩微图格式式（品质）、相片格式相片格式（品质）等后，单击“确定”后，制作的所有工作均由系统完成

“为每张相片建立导览页面”指将大图插入有“导航栏”的网页中

提示：提示：比 FrontPage 中缩微图制作简便