按钮是网页制作中较为常用的元素，利用按钮可以实现图像轮换、页面跳转。下面首先来了解按钮的一些基本特性。
1 按钮特性
　　轮换（Rollover）是按钮制作的重要特性，也就是说，当鼠标光标和鼠标动作变化时，按钮的各种状态相应地轮换显示。按钮是一种特殊的符号，针对网页中的各种鼠标事件，Fireworks在按钮中允许设计了4种状态的按钮图形，分别为以下状态：
　　 Up状态：按钮的默认状态，表示鼠标不在按钮上的显示状态。
　　 Over状态：按钮的悬浮状态，表示鼠标移动到按钮的上方时的显示状态，提示用户所指向的按钮，可以发生相关事件。
　　 Down状态：按钮的单击状态，表示鼠标在按钮上单击后的显示状态。
　　 Over While Down状态：单击按钮后再次移动到按钮上的显示状态，提示用户所指向的按钮已经单击过了。
　　通常情况下，应用网页上的按钮只使用其中的两种状态：Up状态和Over状态。
2 创建按钮
　　按钮的创建是由Fireworks提供的按钮编辑器完成的，利用按钮编辑器可以轻松方便地编辑按钮的各种状态。
　　选择【Insert 】→【New Button】命令新建按钮，此时就会自动启动按钮编辑器。进入按钮编辑器Up标签处于选定状态，也就是按钮的Up状态。在工作区域内绘制圆角矩形，并且设定其内斜面（Inner Bevel）和阴影（Drop Shadow）效果，如图1-1所示。
　　工作区域中十字号“＋”为中心位置，通常情况下绘制按钮的各种图形时最好放置在中心位置。
　　单击Over标签，进行按钮的Over状态编辑，为了避免重新绘制图形和图形调整的麻烦，可以通过单击按钮编辑器窗口右下方的【Copy Up Graphic】按钮，复制Up状态的图像。这样，就可以轻松实现Up状态与Over状态图形位置的一致性。选定复制得到的图形，适当地进行变更，比如图形颜色变淡，其他的设置可以保持不变，如图1-2所示。
　　按钮编辑器左下角的“Onion Skinning”复选框选中状态，表示按钮中各个状态中的图形以半透明的形式显示，便于参考其他状态中的图形进行调整。

　
图1-1 编辑Up状态　　　　　　　　　 图1-2 编辑Over状态

　　单击Down标签，进行按钮的Down状态编辑。同样单击【Copy Over Graphic】将Over状态中的图形复制过来。为了体现按钮的按下状态，通常情况下将复制得到的图形阴影部分减小，同时利用方向键将图形向下微调，使得Down状态图形的最低点与Over状态图形的最低点重合，如图15-3所示。
　　在Down标签窗口， 选中“Include Nav Bar Down state”复选框在导航条中非常有效。通常在网页导航条中的按钮为Down状态时，表明是正在访问的页面。选中“Show Down Upon Load”复选框同样在导航条中应用，表示单击导航按钮载入相应的链接页面时，相应的导航按钮自动呈现Down状态。
　　单击Over While Down标签，进入按钮的Over While Down状态编辑。同样单击【Copy Down Graphic】将Down状态的图像复制过来。选定复制得到的图形，再次改变图形的颜色为紫色，如图15-4所示。

图1-3 编辑Down状态 　　　　　　　　　图1-4 编辑Over While Down状态

　　在Active Area标签中设置的是按钮的有效区域，也就是前面所学的切片。通常情况下采用系统自动设置，即选中窗口左上方的Set Active Area Automatically复选框。
　　单击关闭按钮【×】退出按钮编辑器，此时在文档工作区域中会自动生成新建按钮的实例，如图1-5所示。选中【Window 】→【Library】命令调用库面板，就可以看到在库面板中存放有新建按钮的符号，如图1-5所示。

图1-5 按钮实例及相应的库面板

　　这样就完成具有图1-4状态的按钮，如果要在工作区域中进行按钮效果的浏览，可以直接单击文档窗口上方的Preview标签，就会以设定的优化方式进行预览，根据鼠标所作的各种动作，按钮会显示相应状态的图形，如图1-6所示。
　　如果按钮预览的效果不甚满意，可以调用优化（Optimize）面板进行优化选择。各种优化后还是不行，单击Original标签切换到文档编辑窗口，再双击按钮实例激活按钮编辑器进行按钮的修改，基本类似于创建按钮。

图1-6 预览按钮效果

3 设置链接
　　在网页中设置按钮并不是为了观看按钮的这种轮换效果，而是利用轮换效果引起用户注意以实现网页的链接。可以在按钮编辑器的Active Area标签窗口单击右下方的【Link Wizard】按钮进行按钮的链接设置；也可以通过选定文档中按钮实例的情况下，单击相应对象面板的【Link Wizard】按钮，如图1-7所示。
　　打开Link Wizard对话框，单击其中的Link（链接）标签，相关的内容设置如图1-8所示，其中有三项文本框可以填写：最上方文本框设置的是单击按钮，跳转到链接页面的URL地址；中间设置的是光标在按钮上暂停，在光标中显示的提示性文字；最下方文本框设置的是光标在按钮上暂停，在浏览器状态栏中出现的提示性文字。
　　完成按钮的链接设置，单击其中的Target标签，设置链接网页在浏览器中的打开方式，全部完成设置，单击【OK】按钮确认即可。

图1-7 按钮对象面板 　　　　　　　　　　　　　　　　图1-8 设置链接地

4 导出按钮
完成按钮的创建需要导出以便在网页中使用，对于按钮的导出可以按照切片的导出方法操作。但是按钮在导出前进行优化，不仅可以通过优化面板进行调整，还可以在按钮的Link Wizard对话框中进行设置，单击其中的“Export Settings”标签，如图1-9所示。通常情况下选择默认设置即可。

图1-9 设置导出优化参数