57网页设计与制作课件第2章

整理文档很辛苦,赏杯茶钱您下走!

免费阅读已结束,点击下载阅读编辑剩下 ...

阅读已结束,您可以下载文档离线阅读编辑

资源描述

第2章Fireworks8的基础知识2.1Fireworks8的工作环境2.2Fireworks8的基本操作2.3应用实例2.4本章小结本章重点:了解Fireworks8的工作环境掌握Fireworks8文档的基本操作启动Fireworks8后,屏幕首先显示的是开始页。在开始页中用户可以选择开始工作那个项目。通过开始页,可以轻易访问最常用的操作和最近访问过的项目,还可以产品介绍或教程了解关于Flash的得更多信息。选择开始页中【新建】Fireworks文档,或者【打开】最近使用过的文档,就可以进入Fireworks8主窗口。Fireworks8主窗口如图2-1所示。主要由标题栏、菜单栏、工具栏、工具箱、编辑窗口、浮动面板等组成。2.1Fireworks8的工作环境图2-1Fireworks8的主窗口2.1.1工具栏使用工具栏中的按钮可以快速地完成菜单中的一些常用命令,使得设计工作更加方便快捷。Fireworks8中有【主要工具栏】和【修改工具栏】。【主要工具栏】包含文件的基本操作,操作步骤的撤销恢复及图像内容的复制移动等常用操作,如图2-2所示。【修改工具栏】包含图像对象旋转、组合和改变叠放顺序等常用操作,如图2-3所示。选择菜单【窗口】|【工具栏】|命令,单击【主要工具栏】可以显示或隐藏【主要工具栏】。单击【修改工具栏】可以显示或隐藏【修改工具栏】。图2-2主要工具栏图2-3修改工具栏2.1.2工具箱【工具箱】又称工具面板,如图2-4所示,Fireworks8的工具箱中共有6组不同种类的工具,分别是选择、位图、矢量、Web、颜色和视图工具。有些工具按钮的右下角有个小三角形,表示这是一个工具组,在该工具按钮上按下鼠标左键不放,将会显示该组中所有工具,用户可以选择自己需要的工具。当用户选择一种工具后,在属性面板中将显示该工具的详细参数设置,用户可以设置合适的参数以满足自己使用该工具的需要。选择菜单【窗口】|【工具】命令,可以显示或隐藏工具箱。2.1.3浮动面板浮动面板是Macromedia公司软件产品的一个特色,Fireworks8将一组相关操作集中在一个浮动面板中,处理起来即方便又快捷,且可视化的结果能立即反映到图像中。浮动面板可以折叠、展开、组合、移动、缩放和关闭,即灵活又有效地利用了屏幕的空间,在屏幕个性化视图的组成上,用户有了更多的选择权。如图2-5所示,Fireworks8主窗口右面是浮动面板的停靠区,拖动工作区和浮动面板停靠区之间的分割栏可以改变浮动面板停靠区的宽度。单击分割栏按钮,可以打开或关闭浮动面板停靠区,如图2-6所示,暂时不用浮动面板,可以关闭浮动面板停靠区,扩大工作区。Fireworks8可以把若干个浮动面板组合成一个浮动面板组,由哪几个浮动面板组成一个浮动面板组,用户可以自由选择。图2-7是一个已经展开的由【帧】浮动面板和【历史记录】浮动面板组成的浮动面板组。。图2-4工具箱示意图图2-5浮动面板停靠区和分割栏按钮图2-6关闭浮动面板停靠区图2-7展开的浮动面板组拖动浮动面板组的移动按钮可以在浮动面板停靠区中改变浮动面板组的排列顺序,拖动中在浮动面板停靠区中显示的颜色条,如图2-8所示,也就是正被拖动的浮动面板组的位置。也可以将浮动面板组拖出浮动面板停靠区,浮在工作区的上面。将浮动面板组从外面拖入浮动面板停靠区,必须等颜色条出现才能放开鼠标,否则浮动面板组只是浮在浮动面板停靠区上。在浮动面板组里单击浮动面板的名称可以选定当前活动的浮动面板,单击快捷菜单按钮,可以打开与当前活动的浮动面板相关的快捷菜单,执行更多的命令。单击折叠按钮,可以将浮动面板组折叠起来,如图2-9所示。在折叠的浮动面板组上单击展开按钮可以将浮动面板组展开。图2-8将浮动面板组移入浮动面板停靠区图2-9折叠的浮动面板组Fireworks8中有下列常用的浮动面板:。(1)【混色器】和【样本】面板:用于选择图像中描边和填充的颜色,在【混色器】面板中可以用RGB的数值来选择各种各样的颜色。(2)【层】面板:提供对图像图层的各种操作,对图层进行管理。(3)【帧】面板:提供对动画中帧的各种操作,对帧进行管理。(4)【信息】面板:提供画布上鼠标所在点的颜色和坐标的信息。颜色用RGB数值表示,坐标原点默认为画布的左上角,可以用标尺改变坐标原点。(5)【历史记录】面板:列出最近使用过的操作,以便能够快速撤消和重复这些操作。(6)【库】面板:元件是Fireworks8中可以重复使用的对象,元件保存在元件库中。可以把图像中的对象转换为元件,也可以使用Fireworks8提供的元件,【库】面板提供对元件库中元件的各种操作,对元件进行管理。(7)【优化】面板:用来设置图像文件的输出格式、品质以及最终输出的文件大小等参数。(8)【样式】面板:样式是一组格式的集合,使用样式可以快速地对对象进行复杂的格式化。使用【样式】面板可以方便地使用样式库里的样式,并对样式进行管理。灵活使用浮动面板组可给图形图像编辑带来方便,浮动面板组的基本操作如下。:1.打开浮动面板组选择菜单【窗口】,单击浮动面板的名称,则该浮动面板所在的浮动面板组会在浮动面板停靠区打开。2.选择浮动面板组中的浮动面板单击浮动面板组中的浮动面板名称或选择菜单【窗口】,单击浮动面板的名称,3.关闭浮动面板组在浮动面板组中单击快捷菜单按钮,打开快捷菜单,选择【关闭面板组】命令。4.重命名面板组(1)在浮动面板组中单击快捷菜单按钮,打开快捷菜单,选择【重命名面板组】命令。(2)输入面板组的个性化的名字。5.重新组合浮动面板组(1)单击需要重新组合的浮动面板使之成为当前活动的浮动面板。(2)在浮动面板组中单击快捷菜单按钮,打开快捷菜单,并在级联菜单中选择要加入的浮动面板组。2.1.4属性面板Fireworks8是一个面向对象的软件,工具箱里的工具和Fireworks8图像的组成部分都是对象。对象取不同的属性就会呈现不同的状态,起到不同的作用。Fireworks8中用于给对象设置属性值的是【属性】面板。当选择了不同的对象时,【属性】面板中显示的就是该对象可以设置的内容。单击【属性】面板右下角的小三角按钮,可以选择显示【属性】面板中的部分常用属性或显示全部属性。【属性】面板是一个特殊的浮动面板,也可以做折叠、展开和移动等操作。图2-10是选择了Fireworks8图像中的文本时的【文本】属性面板,显示了文本对象可以设置的全部属性,包括字体,文字大小,颜色等。图2-10选择了文本时的【文本】属性面板图2-11是选择了工具箱里【刷子】工具时的【刷子】属性面板。显示了刷子对象的部分常用属性。包括刷子的大小,颜色等。图2-11选择刷子工具时的【刷子】属性面板2.1.5标尺Fireworks8提供了标尺、辅助线和网格帮助用户在Fireworks8图像中精确定位。标尺以像素为单位。选择【视图】|【标尺】命令可以显示或隐藏标尺。1.改变画布上的坐标原点如图2-12所示,用鼠标拖动标尺左上角的有两条虚线交叉的区域,在画布中将两条虚线交叉点对准要设置为原点的点放开即可。2.利用标尺定位用鼠标拖动需定位的对象,水平和垂直标尺上会出现黑色的色块,如图2-13所示,使两色块均对准要定位的刻度值即可。图2-12设置坐标原点图2-13利用标尺定位2.1.6辅助线与网格辅助线可为用户绘制图形和对象定位提供帮助。Fireworks8还提供了将对象吸附到辅助线的功能,即当对象移到离辅助线一定距离时会自动吸附到辅助线上。在对图像进行编辑时可以锁定辅助线,使其不能移动。网格可视为一系列等距离的水平和垂直辅助线构成的体系,同样有显示或隐藏,吸附对象等功能,操作与辅助线类似。1.产生和删除辅助线把鼠标指针定位在标尺内,拖动到画布内,即可产生一根辅助线,将辅助线拖出画布即可将它删除。2.锁定辅助线选择菜单【视图】|【辅助线】|【锁定辅助线】命令,有√复选标记则锁定,无√复选标记则可移动。3.对齐辅助线选择菜单【视图】|【辅助线】|【对齐辅助线】命令,有√复选标记则对象会自动吸附到辅助线,无√复选标记则不会自动吸附。4.显示或隐藏辅助线选择菜单【视图】|【辅助线】|【显示辅助线】命令,有√复选标记则显示,无√复选标记则隐藏,5.改变网格单元格的尺寸选择菜单【视图】|【网格】|【编辑网格】命令,在弹出的对话框中输入合适的网格单元格的尺寸,并单击【确定】按钮确认。2.2Fireworks8的基本操作使用Fireworks8制作图像时,首先应该掌握Fireworks中图像文件的基本操作。文件的基本操作包括新建文档、打开文档、导入文档、导出文档和保存文档等。2.2.1创建新文档创建新文档的操作步骤如下。(1)选择菜单【文件】|【新建】命令,打开如图2-14所示的【新建文档】对话框。(2)输入画布的宽度和高度值,度量单位可以是像素、英寸或厘米。输入分辨率,单位可以是像素/英寸或像素/厘米,默认的分辨率是72像素/英寸。(3)在【画布颜色】选项组中设置画布的颜色,颜色可为白色、透明色或者自定义的其他颜色。(4)单击【确定】按钮。图2-14【新建文档】对话框2.2.2打开文档打开文档的操作步骤如下。(1)选择菜单【文件】|【打开】命令,打开【打开】对话框,如图2-15所示。(2)在【查找范围】文本框中确定要打开的图像文档的位置,并在【打开】对话框选择所需要的图像文件,单击【确定】按钮,就可以打开一个已存在的图像。也可以选择菜单【文件】|【打开最近的文件】命令,打开的子菜单中会列出最近打开过的图像文件,单击选择所需的文件名,就可以便捷地打开该图像文件。如果选中多个图像文件,并选择【打开】对话框底部的【以动画打开】的选项,就可以将选中的多个图像制作成逐帧动画。2.2.3导入文档在Fireworks8中,可以将已有的图像文件作为一个对象插入到正在编辑的图像中,插入的图像也可以是其他格式的图像文件,例如:Photoshop格式的图像文件,FreeHand格式的图像文件,Illustrator格式的图像文件,未压缩的CorelDRAW格式的图像文件和动画GIF格式的图像文件。图2-15【打开】对话框导入图像的操作步骤如下。(1)新建或打开一个图像。(2)选择菜单【文件】|【导入】命令,打开【导入】对话框。(3)在【导入】对话框中选择所需要导入的图像文件,单击【打开】按钮。(4)在编辑窗口中可以看到鼠标指针变成一个直角的折线,在需要显示图像的区域的左上角向右下角拖动鼠标,此时会随鼠标拖动出现一个线框,释放鼠标后即可出现导入的图像。2.2.4保存文档图像文档保存的操作步骤如下。(1)选择【文件】|【保存】命令,如果图像是第一次保存,则会打开如图2-16所示的【另存为】对话框。(2)在【另存为】对话框中选择图像的保存路径和输入文件名,单击【保存】按钮即可保存该图像,此时保存的图像文件类型只能是png图像文件。(3)如果图像不是第一次保存,则不会打开【另存为】对话框,直接将图像以原文件名保存在原路径下。图像【另存为】与【保存】的区别在于可以把图像保存为其他格式的图像文件。选择【文件】|【另存为】命令,在【另存为】对话框中的【另存为类型】下拉列表中可以选择需要的文件类型,如图2-17所示。图2-16【另存为】对话框图2-17【另存为】对话框中的【另存为类型】下拉列表2.2.5导出文档Fireworks8采用的图像文件格式是png格式,由于其中保存了图层、帧等信息,所以文件较大,一般不适合直接用于网页制作。导出图像的操作会将图像中的所有图层合并,并采取优化措施,把图像保存为JPEG或GIF等占用空间较小的图像文件格式,也可以保存为gif格式的动画。Fireworks8附带了一些与网页制作有关的功能,会自动生成相关的HTML文件,导出图像的操作可以把相关的HTML文件和图像文件一起保存。导出操作还可以将正在编辑的图像的一部分保存为一个单独的图像文件。导出操作不会破坏正在编辑的png格式的图像文件。导出操作要设置导出图像的格式及导出图像的质量等参数,Fireworks8会保持这些参

1 / 59
下载文档,编辑使用

©2015-2020 m.777doc.com 三七文档.

备案号:鲁ICP备2024069028号-1 客服联系 QQ:2149211541

×
保存成功