当前位置: 首页 > 图文教程 > 平面设计 > FireWorks > Fireworks中设计网页虚线的几个妙招

FireWorks
Macromedia Fireworks MX的新特性一
Macromedia Fireworks MX的新特性二
Macromedia Fireworks MX的新特性三
Macromedia Fireworks MX的新特性四
Fireworks4 巧用无缝填充处理图片
Fireworks4 制作透明字
Fireworks中螺旋运动字的制作
Fireworks常见问题解答(7)
Fireworks常见问题解答(6)
Fireworks常见问题解答(5)
样式在FW MX 2004中的应用
用Fireworks轻松制作网页交互按钮
巧用Style制作立体感文字
Fireworks制作产品展示图
FireWorks象素按纽教程
Fireworks MX 之 初体验5-2
Fireworks MX 之初体验3-1
撕纸边缘效果制作方法详解
立体贴图字特效制作
Fireworks MX 2004特效字系列教程:晶莹文字制作

FireWorks 中的 Fireworks中设计网页虚线的几个妙招


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-08-15   浏览: 91 ::
收藏到网摘: n/a

网页设计中我们会用到很多种样式的分隔线,下面我们就来看看在Fireworks中设计网页虚线有哪些妙招。
 
方法一、用Fireworks中自带的虚线样式

Fireworks中自带的虚线样式有:三条破折线、加粗破折线、双破折线、基本破折线、实边破折线、点状线。

在网页设计中,我通常的用的是实边破折线。因为它和网页CSS中border的dotted、dashed两个参数效果相似。在制作网页时,不需要导出切割图片,而是用CSS定义。

但有时候总觉得自带的那些虚线不适用,或者想设计更有特色的网页设计图时。我们还需要用到其他的虚线。

方法二、用Fireworks的自带纹理

画一个1像素高的矩形(边宽为0,填充所需色),然后给它添加Fireworks的自带纹理,纹理总量设为100%。

以下是一般可用的1像素高的纹理虚线效果图:

注意:高于1像素的要多一个步骤,就是需要按Ctrl Alt Shift Z把矩形转换成位图后,再把上面多余的黑色线删除。

其实还有许多纹理,你不妨都去试一下“饼干”、“点”这些都是有效果的。

画竖线的方法:

1、选择“水平线”等可以直接出现虚线的纹理;

2、转成位图,然后旋转90度;

3、把矩形宽度用1个像素以上,直至出现虚线后,再转位图,去多余线。

方法三、用Fireworks的填充图案功能

画一个矩形,然后在Fireworks的菜单“填充-图案-其他”中选择自己画好的线段。

通常也是1像素高的gif文件,按你需要的虚线形式,用画笔或是线段工具画一个几个像素宽的虚线。

效果的修改:

1、在FW中图案真充是有一个填充拉伸杆的,拉伸这个杆,调整出你想要的效果;

2、如果填充杆依然要不到你想要的效果就改外部gif文件。但要另存为一个文件名,再在FW中把矩形的填充重新选一下。因为,你直接把填充外部文件的样式改了后,FW文件中的填充矩形是不会跟着外部文件改的。

外部gif文件,注意,右边要留出2像素的白色空间

填充拉杆的两种不同效果:

前面的黑圆点是填充的起点,后面的黑方框是填充拉伸距离。