网页设计基础教程与上机指导Fireworks 快速入门.pptx

《网页设计基础教程与上机指导Fireworks 快速入门.pptx》由会员分享，可在线阅读，更多相关《网页设计基础教程与上机指导Fireworks 快速入门.pptx（14页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、教学提示和教学目标教学提示：Fireworks 8是创建、编辑和优化网页图像的多功能应用程序。随着该软件版本的不断升级，其功能也在不断加强，因此Fireworks 8受到越来越多图像网页制作者的青睐。目前最新的版本Fireworks 8中文版更是以它方便快捷的操作模式，以及在位图编辑、矢量图形处理与GIF动画制作功能上的多方面优秀整合，赢得诸多好评。本章主要介绍Fireworks 8的概述以及Fireworks 8的工作环境。通过本章的学习，读者可以快速了解、熟悉Fireworks 8。教学目标：熟悉Fireworks 8的基础知识熟悉Fireworks 8的工作环境掌握位图图像的编辑掌握矢量

2、图形的编辑掌握对文本的编辑掌握网页特效文字的制作第1页/共14页23.1 Fireworks 8概述Fireworks是第一个为网页制作而设计的图像处理软件，能使图像以最简洁的方式在网页中显示出最好的效果，它最为突出的功能是可以导入多种格式的图像文件，包括Macintosh的PICT文件，Freehand、Illustrator和CorelDraw等软件制作的矢量文件，Photoshop编辑处理过的PSD文件以及常用的GIF、JPEG、BMP和TIF等格式的文件，甚至还可以导入ASCII码的TXT文本文件，而且Fireworks 8还可以辨识矢量文件中的绝大部分标识和Photoshop文件中的

3、图层。作为一款专门为网页制作而设计的图像处理软件，Fireworks 8卓越的切割和优化导出功能使得用户可以直观简便地找到图像质量与下载速度之间的最佳平衡点。Fireworks 8是Fireworks系列的最新版本，首先对工作界面进行了改进，使之和Dreamweaver8、Flash 8的界面统一；其次增强了部分功能，并对从前版本中已有功能的实现进行了简化。如图23.1所示是Fireworks 8的启动界面。第2页/共14页23.2 Fireworks 8的工作环境Fireworks 8的工作界面主要有标题栏、菜单栏、工具箱、文档窗口、浮动面板和属性面板组成，如图23.2所示为Firework

4、s的工作环境。1.菜单栏2.状态栏3.工具箱4.文档窗口5.属性面板6.浮动面板第3页/共14页23.3 编辑位图图像Fireworks 8提供了大量的工具来编辑位图图像。在编辑图像时，常用的工具有【套用】、【刷子】和【红眼消除】等。23.3.1 使用套索工具编辑位图图像23.3.2 使用刷子工具编辑位图图像23.3.3 使用红眼消除工具编辑位图图像第4页/共14页23.3.1 使用套索工具编辑位图图像使用【套索】工具选择的区域形状是不规范的，【套索】工具在图像中选择自由变形区域。使用【套索】工具的具体操作步骤如下。(1)打开图像文件，选择工具箱中的【套索】工具。(2)拖曳鼠标在要进行选取的区

5、域边缘进行勾勒，如图23.10所示。(3)当要封闭选区时，可以将鼠标放置到开始处，再释放鼠标，此时软件将在开始处和结尾处连成一条直线进行封闭。第5页/共14页23.3.2 使用刷子工具编辑位图图像【刷子】工具是一个非常易用但又非常不容易控制的工具。说其不容易控制，主要是因为该工具的设置非常繁琐，在平面设计软件区域还是不多见的。说其易用，主要是因为该工具是一个自由的绘图工具，只要使用鼠标拖曳即可实现。使用刷子工具绘图的具体操作步骤如下。(1)选择工具箱中的【刷子】工具。(2)在图像中按住鼠标左键拖曳即可在图像上绘制出线条。选择【窗口】|【属性】命令，打开【属性】面板，在面板中显示【刷子】工具的相

6、关参数，如图23.12所示。在【属性】面板中可以进行如下设置。【笔触颜色】：单击【颜色】按钮，在弹出的颜色框中设置刷子的【颜色】。在其右边的文本框中设置刷子的【大小】。单击其右边的列表框，在弹出的菜单中设置刷子的【描边】种类。【纹理】：在该选项的下拉列表中可以选中要使用的各种纹理选项。第6页/共14页23.3.3 使用红眼消除工具编辑位图图像【红眼消除】工具可以消除数码相机照片中经常出现的红眼，使照片恢复正常的效果。使用【红眼消除】工具的具体操作步骤如下。(1)打开图像文件，选择工具箱中的【红眼消除】工具，如图23.15所示。(2)在【属性】面板中设置相应的属性。(3)将鼠标指针移动到红眼上，

7、进行拖动，即可消除红眼。第7页/共14页23.4 编辑矢量图形对于一次绘制的图形，很难符合要求，所以经常需要对其进行编辑修改。编辑矢量图形之前，需先选取要修改的图形对象，在Fireworks 8中，主要使用【指针】工具、【选择后方对象】工具和【部分选取】工具，如图23.17所示。1.选取单个对象2.选取多个对象3.选取被遮挡的对象4.转换为位图图像第8页/共14页23.5 对文本的编辑在Fireworks 8的文件中，文本作为一个对象整体而被保存和控制。用户可以在文件的任意位置输入文本，然后将输入的文本作为对象在文件中进行处理。23.5.1 输入文本23.5.2 编辑文本23.5.3 附加文本

8、到路径23.5.4 转换文本为路径第9页/共14页23.5.1 输入文本当要在文档窗口中输入文本时，选择工具箱中的【文本】工具进行输入。输入文本之前，首先要创建文本块，文本块按照不同的创建方式可以分成两类，分别是自动调节大小的文本块和固定宽度文本块。1.自动调节大小的文本块(1)在工具箱中选择【文本】工具。(2)将鼠标指针置于文档中，在需要创建文本的位置单击，显示出一个插入符。(3)使用键盘或者其他方式输入文本。2.固定宽度文本块(1)在工具箱中选择【文本】工具。(2)将鼠标指针置于文档中，在需要创建文本的位置拖动鼠标，创建一个文本框，如图23.24所示。(3)使用键盘或者其他方式输入文本，如

9、图23.25所示。第10页/共14页23.5.2 编辑文本在Fireworks 8中输入的文本会作为一个对象出现在文档窗口中，可以像选择其他对象一样选择文本，然后对其进行编辑。(1)在工具箱中选择【文本】工具，在文字上进行单击，如图23.26所示。此时【属性】面板如图23.27所示。(2)单击【字体】右边的下拉按钮，在弹出的下拉列表中设置需要的字体。(3)单击【颜色框】右下角的颜色按钮，在弹出的菜单中选择需要的颜色。第11页/共14页23.5.3 附加文本到路径一般文字都按照横排或者纵排直线排列，还可以按照一个任意路径的形态排列。附加文本到路径的具体操作步骤如下。(1)使用工具箱中的【多边形】

10、工具，在文档中绘制一个多边形，如图23.28所示。(2)使用工具箱中的【文本】工具，在文档中单击输入文本，如图23.29所示。(3)选中多边形，按住Shift键的同时选择文字，选择【文本】|【附加到路径】命令，将文本附加到路径，如图23.30所示。第12页/共14页23.5.4 转换文本为路径在Fireworks 8中输入文字后，文字依然保持着文本的属性，均采用内码的形式存在。如果要将文字转换为简单的路径，可以执行以下操作，将文本转换为路径后，可以放弃文字的属性，这样就不怕字体丢失问题的出现。并且文字转换为路径后，可以使用编辑路径的工具对转换为路径的文字进行编辑。转换文本为路径的具体操作步骤如下。(1)在工具箱中选择【指针】工具。(2)选中要进行转换为路径的文字。(3)选择【文本】|【转换为路径】命令，此时文本就会转换为路径，如图23.32所示。第13页/共14页感谢您的观看！第14页/共14页