繁體中文当前位置: 首页 > 图文教程 > 平面设计 > FireWorks > 用Fireworks轻松制作网页交互按钮
- FireWorks
- Fireworks命令插件：Change Text Size
- Fireworks CS3体验之Pages面板
- Fireworks绘制打印机图标
- 实用Fireworks企业标识不扣图反白法
- Fireworks打造质感金属锁图标
- Fireworks CS3基础教程：切片和优化功能的运用
- Fireworks快速简单打造网页“闪字”动画
- Fireworks打造逼真梵高之光特效
- Fireworks轻松打造质感Vista LOGO
- Fireworks教程：打造一个没有钨丝的灯泡
- 用Fireworks 8的位图工具打造精美网页效果图
- 疯狂的补间＆元件＆路径 制作仿3D光亮DNA桌面（试用版）
- Fireworks CS3教程：蒙版的运用基础
- 网页设计翻译教程：图标缩小后变形的解决办法
- fireworks教程：用笔触绘制“毁灭顶峰”效果
- Firework教程：教你制作特殊的切角图形
- Firework教程：韩式风格手提袋的绘制
- Firewoks教程：制作液体金属表面文字效果
- Fireworks教程：电视雪花动画效果的制作
- Fireworks教程：制作一个简单的网页新闻播报框
FireWorks 中的 用Fireworks轻松制作网页交互按钮
出处:互联网 整理: 软晨网（RuanChen.com） 发布: 2009-11-22 浏览: 66 ::
收藏到网摘: n/a
3. 在工具箱中选择矩形工具，在按钮编辑器窗口中拖动鼠标，画一个适当大小的矩形。
4. 从填充面板中选择想要的填充特效(如果填充面板没有显示，可以从Windows菜单上选择Fill命令，打开填充面板)，制作漂亮的按钮图像。本例选择Ripples(波纹)图案、Emerald Green(鲜绿色) ，如图3所示。
5. 输入按钮文本：选择文本工具，在按钮编辑器中单击矩形中心附近，弹出文本编辑对话框。从文本编辑对话框中的字体弹出菜单上选择一种字体，选择点大小，从颜色弹出菜单上选择一种颜色，单击居中对齐按钮(本例选用隶书，25点，红色，居中对齐)，最后单击OK按钮(图4)。
7. 设计按钮的Over状态：按钮的Over状态是指在制作完成的网页中鼠标指针掠过按钮时显示的状态。单击按钮编辑器中的Over标签，按钮编辑器窗口的右下角增加了一个Copy Up Graphic(拷贝Up图像)按钮。单击该按钮，把Up状态的图像复制过来。此时，按钮的Up状态和Over状态相同。要使Over状态有别于Up状态，可以按照上述第4步的方法，改变按钮的填充特效。
8. 设计按钮的Down状态：按钮的Down状态是指在制作完成的网页中按下按钮时显示的状态。单击Down标签，按照上述第7步的方法，可以设计出与前两种状态不同的Down状态。
9. 为按钮建立链接：单击Active Area(激活区)标签，然后单击右下角的Link Wizard(链接向导)按钮，弹出Link Wizard对话框。单击Link(链接)标签，在对话框上部的文本框中输入URL，例如http://www.infosea.126.com，最后单击OK按钮。
11.单击Preview标签就可以预览交互按钮的效果。
12.输出HTML文档：从File(文件)菜单上选择Export(输出)命令，弹出Export对话框，在Base Name文本框中输入文件名，选定HTML文档的风格(Style)和存放位置(Location)，单击保存按钮(图8)。
13.用浏览器浏览生成的HTML文档，查看设计效果。
附注：①Dreamweaver 提供了直接插入或粘贴Fireworks 生成的HTML文档的功能；
②通过按钮复制，改变按钮文本的方法，可以快速、高效地制作出一组外观一致只是文本不同的按钮。
评论 (0) 