Fireworks MX(二十五)按钮和导航

[复制链接]
查看: 279|回复: 0
gggds 发表于 2009-12-27 03:17:03 | 显示全部楼层 |阅读模式
  在 Fireworks 中,可以使用按钮编辑器快速创建一个按钮元件,从库面板中,克隆多个按钮元件,就可以制作成导航栏。   创建带有样式的按钮   使用“按钮按钮编辑器”创建按钮,为了美化按钮,可以应用样式面板中的样式,还可以应用“属性面板”上的各种效果。   1.打开 Fireworks,通过“文件”>“新建”,新建一个文档。   2.“编辑” >“插入”>“新建按钮”。    
9 `! ]; U( E( L! ^
2 O  c. \1 E6 p* P# w- k9 Y, u- p0 ~' p/ s3 l/ L
  3.在按钮编辑器中,选择“释放”状态,画一个宽69像素,高20像素,x,y坐标都为0的矩形。   ) g3 J1 q2 r2 k# i" K; @/ z) v

1 M4 Y( {6 h3 {7 r% O: P' E$ m7 ~1 w8 N/ Q5 {3 {3 K
  ( P9 K. N: ^* k
5 E' H/ k  Z0 f$ }

6 N% H$ P1 n* M$ y+ `  4.选中矩形,然后打开样式面板,点击并且应用一种样式;之后在属性面板上点击填充颜色块,实例中选择红色。   
' l( k0 o. b& e# v% ~3 b+ D* u- z3 I6 o* P
9 J- y% x4 Z1 u' W8 t7 S
  5. 也可以选中按钮,点属性面板上的+增加各种效果。   
# }& o$ w6 {( J* w' m  q& q  L2 J3 ?: }! b- v: p  b

' L9 W2 d7 E2 N' _/ M1 ?  输入清晰的按钮文字   在网页图象中,如果使用较小的中文字体,例如12象素,可以使用“不消除锯齿”的宋体。使用更大的其它字体时,就需要消除锯齿了。   1.在“按钮按钮编辑器”的释放状态下,使用工具面板上的“文本工具”,在按钮上输入文字,在属性面板上,选择宋体,12像素,不消除锯齿。     p5 Z! S; M- o/ J

/ c: @* v) a. @: g  W- O( \/ ^7 m
' i: d8 C  F  O- F: `' B% [  输入文字后的按钮:   8 u. c7 k" y( ^/ ^4 p( ?  M
' y* S0 h/ N" B1 X# k: {
$ B  ~- M# v. J1 x$ h/ a
  使“滑过”状态的按钮颜色相对“释放”状态变亮。   1.选中“滑过”状态,点击“复制弹起时的图形”。   " v+ b* B+ L# G9 m

* `% Y/ C' w/ P: M
" x4 ~. U/ l1 f* @: B  2.点击属性面板上的“+”, 添加效果“调整颜色”>“色相/饱和度”。   . o5 U4 e  ~0 `7 Q5 j" ]) K5 A$ P& [
; K9 }) @6 @& w

5 n1 D* U7 F7 q5 p& ?( p! u  3.在弹出的“色相/饱和度”对话框中,向右拖动亮度滑块。这时就增加了按钮的亮度。   
% U# z) `- z+ p1 o2 b/ H! p9 r# y& Y: ]6 S; R, u

# Q1 b7 y0 K1 z8 O6 v" p, y  重复上面的过程,调整“按下”状态和“按下时滑过”状态的颜色。   6 K# o/ Z  c( A* Y7 L
5 b* G, N( C# \" F, A+ C

( a: F5 b" m* ], \2 d/ i5 q  为按钮增加链接。   1.选中“活动区域 ”,在属性面板的“链接”项中,输入#作为链接,以后可以修改。   
! C. \- n  a# d3 ?3 K/ B; h. k6 t9 p. T" f1 E3 G
5 R2 g2 n) C$ P3 l5 d( ?
  
* D* |: V+ f8 A: l3 N/ A5 S6 n1 w9 T# ~/ I$ i; @( b
  z3 U0 m" B+ T. f
  一个按钮就做好了。  创建导航栏   1. 创建按钮元件后,可以从库面板中,将该元件的一个实例拖到工作区域中,重复这个过程,创建多个按钮。   
: V  K& w/ t' G4 ]- U$ Z7 e6 @: l/ t. w  T% ~/ D

2 {0 K  f0 h9 J( T" [' Z1 Q/ S  2. 为了对齐各个按钮,需要先作出引导线。选中“视图”>“标尺”。   6 q) n4 X% Z8 L, R

; O# S8 Q/ ]; N" N7 Y2 o, @
0 Y) O( U/ R8 p+ [, Y0 x" p  3.从标尺上,拖出水平和垂直的引导线。   
) `( H7 s5 X3 S0 c* M% G8 T/ S
5 e" R) M4 l* P
6 Y* c7 V8 L8 g' _  4.反复从库面板中,把按钮的实例拖到文档中,并且对齐到引导线。2 n, Y( z" l- A$ G

* V+ [6 i& o6 E4 _) c3 J3 ]& ]% ?3 O
  5.选中不同的按钮实例,在属性面板上,修改文本和链接地址。   
( u  H7 n+ p" p% h  s- A, ~6 B8 h+ E3 p- m

$ [' d/ `- A9 Q$ h  6.使用“文件”>“导出”,保存类型“HTML和图像”,输出导航条。   
: I7 G: S: v) ?- r1 N6 r4 _4 |) _: [
7 b- x, H1 Y, S* z6 ~& t  `  a! q
【责任编辑 admin】

本版积分规则

精彩图文

Copyright   ©2015-2016  展示网  Powered by©Discuz!  技术支持:凡尚展览     ( 粤ICP备14065977号 )