打印

[Fireworks教程] 用Fireworks制作简洁清爽的网站

用Fireworks制作简洁清爽的网站

  网络的已经成为人们日常生活中的一部分,就像生活中房子,大部分人也想拥有自己网络空间,如果把自己的房子设计的漂亮大方呢?下面我们就以一个简洁清爽的页面为例来教大家如何设计一个好网页。
/ p. I7 O2 O) O2 P# a( Dbbs.163k.com
* s+ K7 \3 {8 G  t' ^% N: M163k团购网站系统官方服务论坛  1. 启动Fireworks,新建一个大小为180*200像素的画布,设置画布颜色为 #EFEFEF。 为互联网事业发展提供源动力!) u; A* B, H. i; j

0 @8 V+ @& m3 M1 [, p! J: Z为互联网事业发展提供源动力!  2. 在工具栏中选择矩形工具,绘制一个154* 183的矩形,在属性面板中设置这个矩形的填充色为#A9B1BE,描边设置为1像素的柔化,颜色为#677387,如图所示。团购网站系统,团购网程序% V, ^5 Z1 T  H  }' D6 e4 @  m6 D
163K网站系统官方论坛4 X- x2 x; G& j' ?
163K网站系统官方论坛6 x7 k8 g! Z3 D0 \, @1 h' M
  3. 利用矩形工具绘制一个宽 152,高 19 的矩形,在属性检查器中设置描边为无,填充类别改为线性, 修改线性填充的颜色样本,第一个颜色样本的颜色为#E6FFFF,然后单击渐变色阶下面的区域,新增 一个新的颜色样本,颜色为 #A4BECF,最后一个颜色样本为 #FFFFFF,具体设置如图所示:
) q( f7 _5 q, i5 t- M( x) `9 Nbbs.163k.com
) u5 B- N/ r/ x- }2 k" d# z163k团购网站系统官方服务论坛
* s5 ?# X$ o8 k- g
. V2 T$ y+ I+ B% y4 B! [bbs.163k.com  回到画布上,调整一下渐变方向,现在你的图看起来应该像是下图那样。 
7 c! M* G2 ]9 F163k团购网站系统官方服务论坛
+ [9 n2 i# c$ Q) i; e' r7 [bbs.163k.com  4. 以步骤 3 同样的方式制作下面的矩形。 ) e- K) g3 w  ]6 @, Y8 d9 m" o- N
163k团购网站系统官方服务论坛$ Y5 ~: Y7 p+ f0 L$ S+ Y
163K网站系统官方论坛/ ^$ _2 N# F9 b
  选中下边的矩形,在属性检查器的效果菜单中,选择“阴影和光晕”>“投影”,为矩形添加一个阴影效果, 具体参数如图所示。   163K网站系统官方论坛% Y8 ?0 h% I, f4 n) g: a; o0 a

5 l- F( {* G/ g) E/ E* U163k团购网站系统官方服务论坛  5.使用直线工具画出两条长为153的线段,颜色为 #677387,描边种类为1 像素柔化,分别放在上方矩形的下边及下方矩形的上边。 163K网站系统官方论坛, C# b% j. H3 |3 C5 \1 @
团购网站系统,团购网程序+ d6 y8 @& R" I, T* X/ [
  6. 加入标题列的文字,字体为 elektr_02_5,大小为 10,不消除锯齿,加入内容区的文字,字体为 04b03b,大小为 8,不消除锯齿,   
6 G6 z: G: q2 t7 d0 a/ T: r# a6 k! Z163K网站系统官方论坛
, g' Z. c! \+ e9 J: d为互联网事业发展提供源动力!  7. 在帧面板,单击“新建/重制帧”按纽,新增一帧。返回到第一帧,按“Ctrl”+“A”全选中画布上的所有对象,按“Ctrl” +“C” 复制,然后到第二帧,按 “Ctrl” +“V” 粘贴,然后按住SHIFT键不放,选择将帧二上的 HOME、FIREWORKS、DREAMWEAVER 文字,往上及往左各偏移 1 个像素,这是要制造当鼠标移到文字上时,使其产生偏移的效果。 % l) a& H5 d+ ]( _1 Y, F

9 [- U- b: L  u: x% S. _bbs.163k.com  8. 回到第一帧,选择工具栏上的切片工具,将文字链结的区切割出来。   
4 e* a3 T- A3 A0 `. k: Z8 ?bbs.163k.com163K网站系统官方论坛: d, l& M& h0 |+ _" C
  然后切换到指针工具,单击 HOME 的切片,在弹出的菜单中选择“添加图像交换行为…”,在弹出的交换图像对话框中,选择相对应的切片,单击确定。   163K网站系统官方论坛+ i5 ?9 B$ q4 Z& D; g) u) K
为互联网事业发展提供源动力!( S8 B* g& v% b
  用同样的方法,分别制作 FIREWORKS、DREAMWEAVER 交换图像的行为。 团购网站系统,团购网程序& G. b+ f' O' g" e* H; r! S2 V

8 n9 l* u$ r) n5 e9 y8 V3 b163K网站系统官方论坛  提示:你可以先切换到预览视图,将鼠标移到链结上察看效果。 为互联网事业发展提供源动力!% [' e8 X& J. b
  9. 综合以上各步骤,将可以将整个网页版型制作完成,最终效果如图所示。    163K网站系统官方论坛$ B  C6 r- L1 B* v- e* h+ Z8 I! t
团购网站系统,团购网程序% }9 m( N/ G- W8 s7 Q/ u8 {" J0 A
  这个页面是我喜欢的类型,感觉清清爽爽的,希望您也会喜欢。 点击这里下载源文件

TOP

返回顶部
AYBlue

Processed in 0.064737 second(s), 7 queries.

当前时区 GMT+8, 现在时间是 2009-1-9 21:05 京ICP备06054220号

清除 Cookies - 联系我们 - 163K.com - Archiver - WAP