网页设计与制作 教学课件 作者 耿杰 主编 第6章.pptVIP

网页制作与设计主编 耿杰科学出版社 第6章 Fireworks MX 图形处理基础 使用FireworksMX 2004可以创建和编辑位图、矢量图形和动画，还可以实现网页设计中常 见的交互效果，比如翻转图像，下拉菜单等，设计完成以后，可以将它输为HTML 和JavaScript代码的网页文件，还能输出为 可以在Photoshop、Ilstrator和Flash等软件 中编辑的格式。 教学重点与难点 位图与矢量图 图层 切片 特效文字 菜单 元件 动画 6.1 FireworksMX简介 1、 位图与矢量图 2、 Fireworks MX的系统需求 3 、Fireworks MX 基本功能 Fireworks 是一个创建、编辑和优化网页图形功能应用程序。可以创建和编辑位图和矢量图像、设计网页效果、修剪和优化图形。 绘制矢量对象、位图对象或文本后，可以使用各种工具、效果、命令和技术来增强和完善图形。可以使用“按钮编辑器”中的 fireworks 工具创建交互式导航按钮。 可以使用 Fireworks 工具编辑导入的图形。可以导入和编辑 JPEG、GIF、PNG、PSD 和其它许多文件格式。导入图形之后，可以对其进行修剪、润饰、蒙版处理、调整其颜色和色调等处理。 切片和热点是指定网页图形中交互区域的网页对象。 6.2 Fireworks MX 工作界面 6.3 Fireworks MX 交互按钮的制作  6.4 制作特效文字 1 、制作特效文字 2、 运用文字路径 6.5 Fireworks MX 图像处理  6.6 菜单、元件、标题动画的制作  2 、元件 元件是可重用的对象。Fireworks 提供三种类型的元件：图形、动画和按钮。每种类型的元件都具有适合于其特定用途的独特特性。实例是 Fireworks 元件在图形文档中的实例。当对元件对象（原始对象）进行编辑时，实例（副本）会自动更改以反映对元件所做的修改。元件对于创建按钮以及通过多个帧中的对象制作动画很有帮助。 3 、动画 动画图形可以为网站增加一种活泼生动、复杂多变的外观。例如，可以在徽标淡入淡出的同时让公司的吉祥物在网页上来回跳动。 在 Fireworks 中通过向称为动画元件的对象分配属性来创建动画。一个元件的动画被分解成多个帧，帧中包含组成每一步动画的图像和对象。可以对元件应用不同的设置以逐渐改变连续帧的内容。可以让一个元件在画布上来回移动、淡入或淡出、变大或变小或者旋转。因为单个文件中可以有多个元件，这样就可以创建一个不同类型的动作同时发生的复杂动画。当按顺序播放所有帧时，就成了动画。 6.7本章小节 本章通过一些案例介绍了Fireworks MX的简单应用，其中主要介绍了简单的文字特效、按钮、元件、弹出菜单、动画的制作，对图层和混合模式的运用也作了简单的介绍。Fireworks MX是一款功能强大的WEB图形处理和设计工具，与Macromedia 的Dreamweaver、Flsah能够紧密配合，制作出令人满意的网页效果。 * * 标题栏 菜单栏 工具栏 工具箱 位图工具 面板抓取器 属性检查器 面板组 面板标题 面板菜单 文档窗口 按钮是网页的导航元素，几乎可以将任何图形或文本对象制作成按钮。按钮最多有四种不同的状态，每种状态表示该按钮在响应不同鼠标事件时的一种外观样式，以便用户区分不同状态。“释放”状态 、“滑过”状态是、“按下”状态、 “按下时滑过”状态。 利用按钮编辑器，可以创建所有这些不同的按钮状态以及用来触发按钮动作的区域，可以为按钮设置超级链接，轻松便捷地创建交互式按钮。 Macromedia Fireworks MX 提供了丰富的文字处理功能，可以用不同的字体和字号创建文字，并且可调整其字距、间距、颜色、字顶距和基线等。可以编辑垂直文字、变形文字、附加到路径的文字以及转换为路径和图像的文字。将 Fireworks 文字编辑功能同大量的笔触、填充、效果以及样式相结合，能够使文字成为图形设计中一个生动的元素。可以导入文字，在导入文字的同时保留丰富的文字格式属性。在导入文字时可一为缺少字体的文字选择一种替换字体，或者将文字作为静态图像导入。 在Fireworks MX 中可以方便的绘制各种矢量图形，也可以对位图和适量图进行复杂的处理。Fireworks MX 把位图、矢量图、文本组织成位于层上的单独对象。对象的应用提高了编辑处理的灵活性。 1、 绘制形状图形 2、 绘制路径图形 3、 图形的填充与描边 4 、编辑对象的选择 5 、图层的运用 6、热点和切片 1、 菜单 随着网站页面