Fireworks-网页设计综合实例
网页设计实用教程 第12节 Fireworks CS4进阶操作
3. 蒙版实用技巧
4. Fireworks路径编辑技巧
12.3.3、图像的优化 创建尽可能快地被下载的优美图像是网页图形设计的最终目 标，为此，必须对图片进行一定的处理，使图片在最大限度保 持图像品质的同时，尽量选择压缩质量最高的文件格式，这种 处理过程称为优化。 12.3.4、图像的导出 在前期的设计工作完成之后，最后一步就是导出所设计的作品， 在Fireworks中创建并优化图形后，用户可将该图形输出为常用 的Web格式及供其他程序（如Freehand）使用的向量图形格式。 Fireworks 由于它的面向网络的特性，导出的形式可以不仅仅是 图像，还可以是包含各种链接和Java Script信息的完整的网页。 由于图像的导出和优化一样将产生一个导出副本，因此是不会修 改原图的，所以，用户可以尝试在Fireworks中用一幅原图导出 不同种类的许多图像。
12.3.2、Fireworks实用技巧 Fireworks CS4的功能十分强大，它可以很方便地使用 Fireworks来制作普通Web图像，还可以创建出Web动画、 Web按钮、Web导航条，也可以用于创建复杂的交互效果和 弹出式菜单。 1. Fireworks工具箱的使用技巧 2. 利用样式快速制作按钮
在Fireworks CS4中主要有以下这些颜色混合模式
正常：普通模式，即不应用颜色混合模式。 色彩增殖：底色乘混合色，生成更深的颜色。 屏幕：底色乘混合色的反色，生成一种漂白效果。 变暗：选取底色和混合色中较深的颜色作为结果色，生成较深的颜色。 加亮：选取底色和混合色中较浅的颜色作为结果色，生成较浅的颜色。 差异：从底色中将混合色减去或从混合色中将底色减去，生成相反的颜 色。 色相：将混合色的色调值与底色的亮度和饱和度值组合，生成新的颜色。 饱和度：将混合色的饱和度值与底色的亮度和色调值组合，生成新的颜 色。 颜色：将混合色的色调值及饱和度值与底色的亮度值组合，生成新的颜 色。 发光度：将混合色的亮度值与底色的色调值和饱和度值组合，生成新的 颜色。 色彩：给底色添加灰色。 擦除：删除所有的底色像素，包括背景图像中的底色。
Dreamweaver-CC实例教程(第5版)-第12章-综合设计实训
第12章 综合设计实训本章简介：本章的综合设计实训案例，根据网页设计项目真实情境来训练读者如何利用所学知识完成网页设计项目。
通过多个网页设计项目案例的演练，使读者进一步牢固掌握Dreamweaver CC2019的强大功能和使用技巧，并能应用所学技能制作出专业的网页设计作品。
掌握表格布局的应用方法和技巧掌握CSS样式命令的使用方法掌握动画文件和图像文件的插入方法和应用掌握超链接的方法和创建掌握表单的创建方法和应用课堂学习目标案例类别个人网页游戏娱乐网页户外运动网页房产网页购物网页12.1个人网页—李梅的个人网页项目背景及要求项目创意及制作1．客户名称李梅2．客户需求李梅是一名专业的视觉设计师，为了使更多的人认识和了解她以及展示其设计成果，需要制作一个属于她的个人网站，网站内容包括其个人资料、个人作品、设计方向等。
要求内容全面，具有独特的个性和个人特色。
3．设计要求（1）网页风格要求具有艺术与设计感。
（2）要求具有张扬的设计风格，充分凸显个性。
（3）分类明确，注重细节的修饰。
（4）使用红色作为网站的主体颜色，并且使用个人照片和作品图片进行装饰。
（5）设计规格为1600像素（宽）×1296像素（高）。
项目创意及制作使用“Table”按钮，插入表格；使用“Image”按钮，插入图像；使用“CSS设计器”面板，调整文字的颜色和大小。
效果图12.2游戏娱乐——锋后游戏网页项目背景及要求项目创意及制作项目背景及要求1．客户名称锋后游戏公司2．客户需求锋后游戏公司是全球领先的游戏开发公司，公司现推出几款新的游戏，要设计一个网页为其前期的宣传做准备，网页内容要求能够表现公司的特点，并达到宣传效果。
3．设计要求（1）浅色的背景与深色图像形成对比，突出前方的宣传主体。
（2）热烈的游戏画面能瞬间抓住访问者的视线，让人印象深刻。
（3）整体设计整洁干净，方便访问者的操作。
（4）沉稳严谨的设计体现出公司的经营特色。
使用遮罩-Fireworks教案
使用遮罩-Fireworks教案教案章节：第一章-第五章第一章：认识遮罩1.1 教学目标：让学生了解遮罩的概念和作用学会使用Fireworks创建遮罩效果1.2 教学内容：遮罩的定义和分类Fireworks遮罩工具的使用方法遮罩的创建和编辑技巧1.3 教学步骤：1. 导入：展示遮罩效果的图片，引导学生思考遮罩的作用和应用场景。
2. 讲解：介绍遮罩的定义和分类，如线性遮罩、径向遮罩等。
3. 演示：使用Fireworks创建遮罩效果，展示遮罩的创建和编辑技巧。
4. 练习：让学生动手实践，创建简单的遮罩效果。
第二章：创建线性遮罩2.1 教学目标：让学生学会创建线性遮罩效果掌握线性遮罩的参数设置和调整技巧2.2 教学内容：线性遮罩的创建方法线性遮罩的参数设置和调整技巧线性遮罩的应用实例2.3 教学步骤：1. 导入：展示线性遮罩效果的图片，引导学生思考线性遮罩的特点和应用场景。
2. 讲解：介绍线性遮罩的创建方法，如使用遮罩工具或导入遮罩图案等。
3. 演示：使用Fireworks创建线性遮罩效果，展示线性遮罩的参数设置和调整技巧。
4. 练习：让学生动手实践，创建线性遮罩效果并调整参数。
第三章：创建径向遮罩3.1 教学目标：让学生学会创建径向遮罩效果掌握径向遮罩的参数设置和调整技巧3.2 教学内容：径向遮罩的创建方法径向遮罩的参数设置和调整技巧径向遮罩的应用实例3.3 教学步骤：1. 导入：展示径向遮罩效果的图片，引导学生思考径向遮罩的特点和应用场景。
2. 讲解：介绍径向遮罩的创建方法，如使用遮罩工具或导入遮罩图案等。
3. 演示：使用Fireworks创建径向遮罩效果，展示径向遮罩的参数设置和调整技巧。
4. 练习：让学生动手实践，创建径向遮罩效果并调整参数。
第四章：遮罩的应用实例4.1 教学目标：让学生学会使用遮罩制作实际应用效果掌握遮罩在不同场景下的应用技巧4.2 教学内容：遮罩在图像处理中的应用实例遮罩在按钮制作中的应用实例遮罩在网页设计中的应用实例4.3 教学步骤：1. 导入：展示遮罩应用实例的图片，引导学生思考遮罩在不同场景下的应用。
网页设计综合实践题(2篇)
第1篇一、题目背景随着互联网的普及和快速发展，网页设计已经成为一门重要的技能。
为了提高学生的网页设计能力，培养具有创新精神和实践能力的设计人才，特此开展本次网页设计综合实践题。
本次实践题旨在让学生综合运用所学知识，设计一个具有实用性、美观性和创新性的网页。
二、实践目标1. 熟练掌握网页设计的基本流程和工具；2. 学会运用HTML、CSS和JavaScript等前端技术；3. 提高网页美感和用户体验；4. 培养团队合作和沟通能力。
三、实践内容1. 网页需求分析（1）明确网页的主题和目标受众；（2）收集相关资料，了解同类网页的设计风格和功能特点；（3）制定网页的功能需求和页面结构。
2. 网页设计（1）根据需求分析，确定网页的整体风格和色彩搭配；（2）设计网页的布局和版式，确保页面整洁、美观；（3）运用HTML、CSS和JavaScript等技术实现网页的交互功能。
3. 网页制作（1）使用HTML编写网页结构；（2）使用CSS美化网页样式；（3）使用JavaScript实现网页的动态效果。
4. 网页测试与优化（1）检查网页的兼容性，确保在不同浏览器上都能正常显示；（2）测试网页的响应速度，优化页面加载时间；（3）检查网页的交互功能，确保用户体验良好。
四、实践步骤1. 确定主题和目标受众根据个人兴趣或市场需求，选择一个主题，明确目标受众，为后续设计提供方向。
2. 收集资料和调研查阅相关资料，了解同类网页的设计风格、功能特点等，为网页设计提供灵感。
3. 制定网页功能需求和页面结构根据主题和目标受众，明确网页的功能需求和页面结构，确保网页的实用性。
4. 设计网页风格和色彩搭配结合主题和目标受众，设计网页的整体风格和色彩搭配，确保网页的美观性。
5. 制作网页（1）使用HTML编写网页结构；（2）使用CSS美化网页样式；（3）使用JavaScript实现网页的动态效果。
6. 测试与优化（1）检查网页的兼容性；（2）测试网页的响应速度；（3）检查网页的交互功能。
Dreamweaver第17章--Dreamweaver与Fireworks的完美结合
17.1 在Dreamweaver中编辑Fireworks图像
• 在Dreamweaver中编辑Fireworks图像，省去了切换软件和保存图像 文件旳麻烦。系统会自动保存更新修改正旳图像。详细操作环节如 下：
17.2 在Dreamweaver中编辑Fireworks HTML
• 在20.1节中详细简介了在Dreamweaver CS4中编辑Fireworks图像。 由Fireworks CS4创建旳HTML文档，如弹出菜单、热区、切片等，与 Dreamweaver CS4也具有很好旳兼容性。下面以弹出菜单为例，来学 习怎样在Fireworks CS4中创建弹出菜单，在Dreamweaver CS4中插 入和更新Fireworks CS4生成旳HTML文档。
第17章 Dreamweaver与Fireworks旳完美结合
• Dreamweaver CS4和Fireworks CS4是Adobe企业旳网页制作利器，它 们之间具有强大旳兼容性，这种无缝结合旳特征大大降低了网页设 计者进行软件切换旳时间，使网页制作和图像处理旳效率得到了有 效旳提升。本章将主要简介在Dreamweaver中编辑Fireworks图像、 插入更新Fireworks HTML，将Fireworks文件导出到Dreamweaver库， 以及创建网站相册等内容。
17.2.3 在Dreamweaver中更新Fireworks HTML
• 当在Firewor4中旳弹出菜单。详细操作环节如下：
17.3 将Fireworks文件导出到Dreamweaver库
• 在Fireworks CS4中能够将图像源文件直接导出到Dreamweaver CS4 旳库中，以便在制作网页时调用。这么以来，省去了在不同软件之 间切换旳麻烦。详细操作环节如下：
网页制作技术教案免费学技术改变生活
第一模块 Fireworks教学课题：第十章Fireworks8入门计划课时：2课时授课形式：多媒体教学教学辅助：投影，电脑教学目的与要求：1.了解Fireworks的功能和新特性2.掌握Fireworks的工作界面、工具箱、面版组等3.掌握Fireworks基本文档操作4.掌握有关图像编辑的基本概念知识点：教学重点：1.Fireworks的工作界面2.文档的基本操作3.像素的概念教学难点：1.Fireworks的工作界面2.矢量图和位图的区别突破难点的关键：1.实例讲解，区别对比作业布置：1.课本第125页填空题，直接做在书上2.作业本：写出矢量图与位图的区别本课小结：Fireworks8是一款用来设计网页图形的多功能应用程序。
随着版本的不断升级，功能的不断加强，Fireworks受到愈来愈多图像网页制作者的青睐。
目前最新版本Fireworks8更是以它方便快捷的操作没事和在位图编辑、矢量图形处理与GIF动画制作功能上的多方面优秀整合，有的诸多好评。
通过本课的学习，应该掌握以下内容：认识Fireworks8工作区，掌握基本的文档操作，掌握图像编辑的基本概念。
新课引入：第十一章使用Fireworks8制作图片11.1路径的绘制与编辑；11.文本的创建与编辑····················································································教学过程与时间分配：一、Fireworks8界面与功能简介：（约50分钟）(一)Fireworks8的新功能：(二)Fireworks8的工作区域：标题栏、菜单栏、工具栏、工具箱、属性面板、面版组合、文档窗口、标尺辅助线、二、基本文档操作：（约20分钟）(一)创建新文档：(二)打开和关闭已有文档：(三)保存文档：(四)还原打开的文档：文件-还原(五)使用【历史记录】面版撤销和重复多个动作：三、有关图像编辑的基本概念：（约30分钟）(一)矢量图形：1.概念：使用“矢量”的线条和曲线（包含颜色和位置信息）呈现的图形。
网页设计与制作(Dreamweaver CC)模块6 综合应用
01 模块1 网页基础知识 02 模块2 初级应用 03 模块3 网页布局 04 模块4 高级应用 05 模块5 网站的测试与发布 06 模块6 综合应用
任务16 完美新娘 ——网站设计综合应用
任务描述 通过“完美新网页、模板创建和更新网页的 方法和 技巧。 任务解析 在本任务中，需要完成以下操作： 熟悉使用表格布局网页的方法和技巧； 熟悉模板的创建和应用； 熟悉使用模板快速更新网站。
ztyp.html 效果图
zxkp.html 效果图
ztyp.html 效果图
qqhp.html 效果图
jchp.html 效果图
任务16 环保科技网站 ——网站设计综合应用
任务描述 通过布局“环保科技网站”网页，巩固使用
CSS+Div 布局和美化网页的方法和技巧。
任务解析 熟悉 Div 的创建和属性设置； 熟悉 CSS 设计器的使用方法； 巩固使用 CSS+Div 布局和美化网页的方法。
ztyp.html 效果图
模块6结束
根据提供的 lx 文件夹中的素材，制作以下网站，网页效果如图 6-33~图 6-36 所示。
综合实训
根据提供的 lx 文件夹中的素材，制作以下网站，网页效果如图 6-33~图 6-36 所示。
综合实训
根据提供的 lx 文件夹中的素材，制作以下网站，网页效果如图 6-33~图 6-36 所示。
综合实训
根据提供的 lx 文件夹中的素材，制作以下网站，网页效果如图 6-33~图 6-36 所示 。
要求： 1 ．布局方法自定。 2 ．使用模板制作如图所示统一风格的页面。 3 ．网页实现灵活跳转。 4 ．网页文本内容格式统一。 5 ．设置超链接颜色变化，并实现滑动鼠标颜色变换效果。 6 ．shyf.html 页面实现交换图像。 7．配置 IIS，在本机 IP 地址中可以打开 lxwm.html 页面。
网页制作及应用第10章
名为“嵩之路”，然后对其进行设置.
显示“可以被注册”的信息。这说明所选域名可 以
进行注册。
查询域名是否被注册
22
返回目录
10.2 综合实例二—域名注册
（2）域名注册 通过在线方式填写域名注册申请表。在查询窗口中点击 “立 即购买”，在接受条款窗口中选“我已经阅读、理解并接受” 后 进入填写信息窗口（注意，要先进行会员登录，如果不是会员， 则需先注册成为会员）。填写完毕后点击“下一步”，在购物 车 中出现域名名称及所需支付的金额，点击“生成定单稍后支 付”。 如下页图所示。
6
返回目录
10.1 综合实例一 —制作主页步骤
4．在topFream区域插入1行2列的表格→在左单元 格中插入网站标志图片logo.png →在右单元格中插 入网站标语图片banner.png→调整图片位置和大小→ 在放置图片的表格下面再插入1行5列的表格→选字 体和居中显示→在5个单元格中分别写入：产品介绍、 公司简介、联系方式、客户反馈、返回首页。
文件为：jianjie.htm，联系方式子页面文件为： connect.htm，9种产品介绍子页面文件分别为：1.htm～9.htm。另外还有 两个用Fireworks制作的图片，一个是网站标志，文件名为：logo.png， 另一个是网站宣传标语，文件名为：banner.png。因为网站文件不多， 所以没定义子文件夹，把所有文件都放在D盘根目录下的rfwz文件夹中 （rfwz意为润丰网站，文件夹名和文件名最好不用汉字）。是本地网站 。 如下图所示。
本地网站
3
返回目录
10.1 综合实例一 —网站的基本结构
小型企业网站的风格要简洁大方、突出主题、直截了当。设计主页
（index.htm）时把企业简介、网站标志、网站标语、公共导航和9种产
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
文档来源为:从网络收集整理.word版本可编辑.欢迎下载支持. 1文档来源为:从网络收集整理.word版本可编辑. Fireworks 网页设计综合实例
在本文中我们将帮助您亲身体验Fireworks在网页创作中的强大功能，我们通过一个网站页面的设计过程，为您详细介绍Fireworks在网页设计的不同阶段是如何处理各种不同任务的。通过解决您所遇到的每一个具体的任务，您将对Fireworks的主要功能有一个统一的全局性的了解，同时为您在设计中如何利用Fireworks提供一个清晰的思路。下图是这个教程完成后的外观：
我们将根据这一个典型网站其中一个页面设计流程，使您逐步学习到以下内容： 1、导入并编辑位图图像。 2、自动任务处理 3、创造矢量图形 4、创建文字 5、创建按钮 6、创建导航条 7、设定按钮属性 8、建立切片 9、创建拖拽翻转效果 10、创建弹出菜单 11、创建变形动画 12、优化图像 13、输出HTML文件到Dreamweaver 14、在Dreamweaver中进行往返表格编辑
一、设计前准备 1、网站介绍： 在教程介绍之前首先让我们来看一下我们将要完成的主要任务。这是一个服饰公司的企业网站设计，公司主要以男式服饰为主，同时也兼顾部分女士服饰。网站的主要任务是帮助文档来源为:从网络收集整理.word版本可编辑.欢迎下载支持. 2文档来源为:从网络收集整理.word版本可编辑. 浏览者了解公司的基本概况和产品信息，并作为公司的一个展示窗口，向参观者展示企业的形象及产品系列。根据业主的要求，网站包含了企业概况、企业人才、产品展示、公司荣誉以及联系方式。我们将以此得到网站的导航结构。
2、设计指导思想： 本网站设计的指导思想是在网络上营造一个优雅、高贵、宁静的氛围，为了体现这一主题，设计者将纹理、景深、光影、基调与有形的模特照片和静态的文字结合起来，更多的使用直线、坚硬的边缘、暗的色调来组成网站界面。页面中以较大面积的男性模特图片突出男式服饰这一主题，以穿插的直线段体现一种服装纹理的感觉。公司的名称则以一种柔软光滑的粗倩体来表现，以打破整个页面的坚硬感，同时以白色突出企业名称，达到非常亮眼的感觉。
3、页面结构： 整个网站采用统一的结构，分为上下两个部分，上面为网站的导航条，下面左边以不同的男式服饰图片及文字标题表示各页主题。右边为内容区，以深色带条纹的图片作为背景。 下面我们将根据上述设计分析，分不同的部分为您介绍制作过程。在新建一个文件后，我们需要对我们的工作环境进行简单的设定，以符合我们的任务要求。首先需要设定工作区的面积及背景颜色，打开Modify>Canvas Size针对常见的800x600分辨率，我们设定工作区的长为776这可以根据需要设定，但最好不要超过778，高为515根据实际内容确定，再执行Modify>Canvas Color设定背景色为黑色。再打开View>Grid>Edit Grid对话框，设定水平方向网格间距为10像素，垂直方向为5像素，并将网格颜色设为暗灰色以不影响观察页面，打开网格显示和网格捕捉。如下图所示：
一、 导入并编辑位图图像。 Fireworks4带有完善的位图创建、修改和处理功能，我们可以导入外部位图文件并对它进行编辑，可以修改和删除位图中的颜色，可以向对矢量图一样增加效果。我们的工作将从层面板开始，新建一个文件后，默认的只有两个图层Web层和Layer1层，双击Layer1层，将层名改为“背景层”。如下图所示： 文档来源为:从网络收集整理.word版本可编辑.欢迎下载支持. 3文档来源为:从网络收集整理.word版本可编辑. 1、我们将一张男性模特的照片导入此层中。 2、双击图片可以进入位图编辑模式，我们可以用矩形选择工具选定不需要的部分并删除它。 3、位图大小调整好后可以使用实时特效进行色彩调节，打开Effect面板，选择Adjust Color/Levels，在Levels分布图中分别拖动三个滑尺，按照下图所示进行色彩调节：
4、导入的位图一般都有一些细小的杂点，我们可以使用Effect>Blur>Gaussian Blur对图像进行一些模糊处理，使其增加一些柔和的感觉，如下图所示：
二、 自动任务处理。 由于我们在后面将多次使用这个处理过程对位图进行加工，因此可以利用Fireworks提供的自动处理功能加快我们后面的工作，这种自动任务处理可以有很多种途径，我们介绍其中最常用的三种： 1 保存为一个Command。打开历史面板History，选定最后两步Effect纪录，在弹出菜单中选择Save as Command，将这两个步骤保存为一个可执行的Command，命名为BMPmodify。以后我们需要时只需执行Commands菜单下的这个BMPmodify命令即可。
2 保存为一个Effect。我们也可以将作用在图片上的所有特效保存为一个内置特效，打开Effect面板，在弹出菜单中执行Save Effect As，将它保存为Mydesign特效。
此时我们打开Effect面板就可以看到我们自定义的Mydesign特效已经在其中了，我们可以像使用其它特效一样使用它。如下图：
3 保存为一个Style。样式是Fireworks中包含对象的描边、填充、特效、字体等属性的一种组合，它可以快速设定对象具有统一的外观，我们也可以将上面的设定作为一个样式保存。选定刚才的位图图像，打开样式面板Style，在弹出菜单中执行New Style，我们只需保留对图片施加的特效即可，按下图进行设定： 文档来源为:从网络收集整理.word版本可编辑.欢迎下载支持. 4文档来源为:从网络收集整理.word版本可编辑. 三、 创造矢量对象 位图是用像素来描述物体的，它适合于表现色彩变化丰富的照片，而矢量图是使用路径和填充来定义对象的外观，它非常容易编辑，并且它的质量不会因大小的改变而丢失或减弱。Fireworks同时提供了编辑这两种格式图像的方法，默认情况下Fireworks是以矢量的方式创建和编辑对象。Fireworks提供了常用的创建矢量对象的工具，我们下面利用这些工具创建基本的矢量图形。 1、 选择工具面板上的矩形工具，在文档顶端绘制一776x30的矩形。 2、 设定填充为线性渐变填充，点击填充面板的Edit按钮编辑填充，如下图所示：
3、 在人像的右半边绘制一个130x400的矩形实色填充对象。 4、 接下来我们将在文档顶端创建按钮对象，首先在层面板中新建一个“导航层”，利用矩形工具创建“公司首页”按钮对象，大小为140x15，填充为红色与黑色之间的线性渐变填充，打开Effect面板，设定Inner Bevel特效，如下图所示：
5、 我们还可以在背景层绘制一些线段，以打破背景的单调感觉。如下图所示： 四、 创建文字 Fireworks还提供了强大的文字处理功能，利用文字编辑窗口可以灵活的对文字进行设定，并且与其它对象一样我们也可以对文字施加各种特效。 1、 选择工具面板的文字工具，打开文字编辑窗口，输入“卡尔松服饰有限公司”，如图所示：
我们看到，在文字编辑窗口我们可以分别对不同的文字设定各自的属性。 2、 在文档左半部分输入相应的英文文字内容，并旋转文字90度，如下图所示：
3、 打开层面板，选定“Karsong”设定它的合成方式为“Luminosity” 4、 打开Effect面板，为“DRESS&ADORNMENT CO..LTD”文字增加Drop Shadow文档来源为:从网络收集整理.word版本可编辑.欢迎下载支持. 5文档来源为:从网络收集整理.word版本可编辑. 特效。
五、 创建按钮 利用Fireworks提供的按钮编辑器，我们可以快速创建具有相似外观的一组按钮，并可以设定按钮的不同状态外观。 1、 使用矩形工具绘制一个90x15的矩形按钮对象，设定它的填充为线性渐变填充，在矩形上方输入“企业概况”。 2、 上一步我们建好了按钮的基本外观，我们可以把它转换为一个按钮符号重复利用。选定上面创建的矩形和文字，按F8将它转换为符号，符号类型为Button。
3、 此时的按钮符号只具有基本的外形，双击刚创建好的这个符号，打开按钮编辑窗口。 4、 常见按钮的Up状态，在按钮编辑器的Up窗口我们可以向编辑普通对象一样，为按钮增加一些特效。打开Effect面板，为此按钮矩形增加Inner Bevel特效，类型为Frame，如图所示：
5、 切换到Over状态，点击下方的“Copy Up Graphic”将Up状态的对象复制到Over状态窗口。改变矩形的渐变填充方向，改变按钮的特效类型为Smooth，如下图：
6、 切换到Down状态，点击下方的“Copy Over Graphic”将Over状态的对象复制到Down状态窗口。改变矩形的填充类型为实色填充Solid，改变按钮的特效类型为Frame1，最后将文字的色彩改变为红色，如下图：
7、 需要注意的是，在按钮的Down状态下，需要取消对“Show Down State Upon Load”的勾选，同时要保证“Include Nav Bar Down state”被勾选，这可以使将来输出时会根据不同的按钮按下情况输出相应的HTML文件。 8、 关闭按钮编辑窗口，按钮的一个实例已经放置在了文档当中。
六、 创建导航条