 |
您现在的位置： 圆点视线 >> 教程 >> 图形图像 >> Fireworks >> 文章正文 |
|
|||
| FW快速制作动态按钮四状态 | |||
作者：网页教学… 文章来源：网页教学网 点击数： 更新时间：2007-9-12 18:11:40  |
|||
|
|
||
| 按钮是网页的重要组成元素之一，在网页中发挥着十分重要的作用。它主要起着两个作用：第一是起到提示性的作用，有提示性的文本或者图形来告诉浏览者点击后会有什么作用，这样的按钮可以是静态的图片，主要是让浏览者了解点击它起到什么作用，甚至可能仅仅是一个小的较为美观的图片。第二是动态响应的作用，即是指浏览者在进行不同的操作时，按钮能够呈现出不同的效果，响应不同的鼠标时间。 这样的动态网页按钮一般有四个状态，即Up（释放）、Over（滑过）、Down（按下）和Over While Down（按下时滑过），要编辑按钮的链接或行为还要设置按钮的Active Area（活动区域）。 今天我们就来介绍如何在Fireworks中快速制作按钮四状态 。文章末尾提供原文件供大家下载参考。 （1）在Fireworks中新建一个大小为200×60的文件，使用工具箱上的圆角矩形工具绘制一个圆角矩形，在属性面板中设置圆角值为47，得到如图1所示的图像。  图1 绘制圆角矩形 （2）然后在属性面板中填充设置中选择"Gradient">>"Linear"，即选择线性填充，并在浮动颜色框中设置第一个颜色块值为#B6B6B6，第二个颜色块值为#FFFFFF，得到图2所示的图像。  图2 设置渐变填充 （3）由于现在是左右渐变，我们想实现上下渐变，其实只要调整渐变填充的控制杆就可以了，如图3所示。  图3 调整控制杆 （4）按住Ctrl＋Shift＋D克隆圆角矩形，然后使用工具箱上的矩形工具绘制一个矩形，并使用选择工具同时按住Shift键选择矩形和克隆所得的圆角矩形，如图4所示。  图4 同时选中矩形和圆角矩形 （5）点击"Modify"菜单，选择"Combine Paths"（组合路径）>>"Punch"（打孔），将两个路径使用打孔效果，得到图5所示的图像。  图5 打孔后的图像效果 （6）选中打孔所得的图形，在属性面板中将其笔触设为无，线性填充的第一个颜色块设为#3399FF，第二个颜色块设为#D0F3FD，适当调整控制杆，并在属性面板中设置不透明度设为70%，得到如图6所示的图像。  图6 调整填充效果 （7）为了实现高光的效果，我们将画布显示的比例调到400%，然后点击工具箱上的钢笔工具，绘制图7所示的路径。  图7 绘制路径 |
||
| 【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口】 文章录入：Rainsion 责任编辑：Rainsion 【字体：小 大】 |
| |
 最新文章 |
| 相关文章 |
 网友评论：（只显示最新10条。评论内容只代表网友观点，与本站立场无关！） |
| 发表评论： |
| 最 新 推 荐 |
| 百度主题推广 | |
| 最 新 热 门 |