为您找到与firework工具相关的共200个结果:
钢笔也许是Fireworks中功能最为强大的工具。下面是读文网小编为大家整理的钢笔工具的基本使用方法,希望大家喜欢~
带小叉的钢笔(画线时)————表示未落笔状态。点鼠标左键相当于画线的起点。
带小尖角的钢笔————表示钢笔编辑状态。点左键相当于选中线的节点。当选中节点后,继续按住左键不放,拖动鼠标可以改变线的弯曲程度,钢笔变成一个小黑箭头;当线的弯曲度合适的时候,放开左键,小黑箭头变成什么都不带的钢笔。
小黑箭头————表示左键未放,可以拖动鼠标改变线的弯曲程度。
什么都不带的钢笔————表示已经画了起点,正在等待确定下一个节点。点左键确定下一个节点。
带小圆圈的钢笔————表示线的起点就是该点。点左键,则该条线完成;钢笔回到带小叉的状态。
带减号的钢笔————表示钢笔工具正指向一个节点,并且该节点处于两个节点之间,并且该节点相邻的两个节点之间的线,至少有一段在该节点无弯曲度(就是说是越靠近该节点越接近直线)。点左键可以删除该节点;点左键后继续按住左键不放,拖动鼠标可以改变相邻两线的弯曲程度,钢笔变成一个小黑箭头;当线的弯曲度合适的时候,放开左键,小黑箭头变成什么都不带的钢笔。
带加号的钢笔————表示钢笔工具正指向两个节点中的连线上。点左键可以增加新节点。
小白箭头(重点,其实也很简单)————表示线处于编辑修改状态,可以拖动线的弯曲控制点改变线的弯曲控制程度,可以选中节点改变节点位置。在钢笔工具状态下,按下Ctrl不放,就可以变成小白箭头状态。
画不连通图形时(即首尾不相连),画到合适的时候切换一下工具就可以了。编辑一个连通图形时,先选中图形,再选中钢笔工具。带小尖角的钢笔(编辑时)出现后,点左键一下可以减掉点一边的弯曲度,这钢笔工具变成带减号的。相当于点两下可以删出该节点。
另外,也可以用指针工具(黑箭头,注意没有“小”字),部分选定工具(白箭头)来修改钢笔工具画出的图。选中图后,按住Alt不放。鼠标即变成了小白箭头,按上面方法修改。
节点————用指针工具选中图形时出现的原图没有的很小的实心方块就是节点。
选中节点————在选中图形的状态下,切换到钢笔工具(或自由变形工具,该工具掌握较困难。)这时节点变成空心的。钢笔工具选中其中一点后,空心又会变成实心。这时可以就说选中了节点。
弯曲度控制点————图形在选中状态下,多出来的两条或者一条线上的顶点。和节点不同的是,控制点始终是实心小圆点。
浏览量:2
下载量:0
时间:
使用“替换颜色”工具可以快速地将图像中的某些颜色转换为选定的另一种颜色。在fireworks怎么使用替换工具呢?下面读文网小编给大家整理了关于,希望大家喜欢。
Fireworks MX 2004版本最大的一个特点是提供了颜色替换工具,如图1。
图1
下面我们来试一试这个新功能,打开一张盛开的鲜花的图片,如图2。
图2
我们将这紫红色鲜花,部分花瓣的颜色替换成其他的色彩。使用替换色彩工具,然后在属性面板中设定工具的形状为圆形,大小为20,容差为255,压力为200.特别注意的是我们要设定将图片中的哪种颜色,替换成哪种颜色,这里将Change中准备替换的颜色设定为紫红色(用墨水笔在图片的花瓣上取色),在To替换后的颜色设定为浅蓝色。如图3。
图3
下面使用颜色替换工具在花瓣上进行颜色处理了,处理时将显示比例放大,让我们看得清楚一些,根据花瓣的大小我们随时更改工具的尺寸。如图4。
图4
通过这个方法,我们将部分花瓣的颜色替换成为浅蓝色,整张图片的效果变了,如图5。
图5
看过“fireworks 替换工具的使用“
浏览量:2
下载量:0
时间:
在网页上的jpg图片如果过大,会严重影响页面的打开速度,Fireworks提供优化图片的功能,即缩小图片的KB,而且不影响画面的质量(除非放大了与原图对比)。fireworks对于网页设计师而言它会更适合网页图片的处理。下面读文网小编给大家整理了关于Fireworks批量处理图片工具的使用,希望大家喜欢。
当然你可以去网上下载工具安装,工具是有名的软件,没有安全性方面可以放心。
点开菜单中的批处理命令。
选择图片后点击增加,或可以点添加全部
点完增加后再点继续
这里是关键的地方了,大家听好了,
1.要把图片批量的设置成品质为85的图片或更改图片的格式可以用“导出”的命令。
2.要把图片的大小尺寸批量改小请用“缩放”。
要注意的是每个命令都有相关的参数,下面详细解释常用的两个功能
双击点“导出”命令,将其添加到右边后,下面出现导出的设置。
一般会自定义,因为我喜欢自己调,当然软件有几种预设好的形式,大家可以自己尝试。
选自定义后出现自定义的设置框
当然这里有几种图片导出格式给大家选择
因为多使用JPG,所以按前一张图设置为85品质的JPG后,点确定,框口消失,设置完成,(还要再设置一下)没事点这里
编辑,再次出现设置框。
同样,“缩放”命令也类似操作。
下面只介绍两种设置:东西不要多,够用就行了,多了就乱了
给定大小值缩放,这里选择100%
按百分比缩小
可以几个命令组合起来用,所以对于图片的操作十分方便。
点继续到下一步,下面的设置十分重要,如果设置错了,你哭也没眼泪。。
在这里有一个备份的设置项,你一定要勾上,这样在图片的文件夹里,软件会生成一个文件夹放你批处之前一步的图片,你可以选覆盖,如果硬盘很大,那你可以选增量备份
然后可以点“批次”,让它工作了,这样你设置的动作,它一会就完成了,是不是很快呢?
以后我会教大家更多的专业网页图片处理的方法和窍门。
网页小专家精华集:
图片你快快显示出来批量图片处理工具Fireworks
看过“Fireworks批量处理图片工具的使用“
浏览量:2
下载量:0
时间:
Fireworks是网页图形图像制作专业工具,网页中出现的任何图形、图像,Fireworks都能处理。熟悉Fireworks中工具箱中各工具的使用很重要。下面读文网小编给大家整理了更多关于Fireworks各工具箱的工具使用的方法,希望大家喜欢。
1:矢量的选定工具:箭头选定工具和被遮图片的选定工具 割图选定工具(选定后双击割除)。
2:图形次选定工具:对对象的组成部分进行选定。
3:编辑选定工具:套索及魔术棒的使用。
4:徒手放大镜工具:
徒手是用来移动操作界面的工具而放大镜是用来放大对象的工具。
5:铅笔及钢笔工具的不同:
铅笔是通过鼠标的拖拽来完成绘制线而钢笔是通过逐段的饿点击 来完成的。
6:矩形及椭圆圆形的绘制工具:用来绘制圆形及多边形。
7:文本框的录入:点击字符A工具进行文本的输入。 你可以调整字体的相关属性。
8:画刷和路径重组工具:绘制纹理图形调整纹理面板。
9:形体的变换工具:
等比例变化工具:旋转/放缩变形,边角及形体内部像素不变。
倾斜工具:以某边为轴的倾斜变形。
扭曲工具:拉伸的边角扭曲变形。
自由格式:显示边处理。
10:;路径修改工具:先选种路径后,在进行操作, 路径涂饰,修改路径纹理效果。
11:取色笔及油漆桶的使用:
取色笔是用来拾取样色,以共填充/纹理使用 油漆桶用于填充色。
12:小刀/笔擦:
小刀用于切割路径的,工作于矢量的编辑模式 笔擦是用来涂改的,工作与图形的编辑模式下。
13:图章:用于复制局部的。
浏览量:3
下载量:0
时间:
说到抠图,一般大家第一反应都会是Photoshop,但是PS的庞大体格,有的时候使用起来并不是很方便。下面读文网小编给大家整理了更多关于用fireworks cs6钢笔工具抠图,希望大家喜欢。
在fireworks 选中右侧工具栏中的“钢笔”工具
使用钢笔工具勾选图片轮廓
将轮廓全部勾出,形成一个封闭的路径
右键选中路径,在弹出的菜单中选择“将路径转换为选取框”
在弹出的工具框中选择“消除锯齿”,也可以选择其它两种,留给大家自己尝试吧
右键单击选中选取框,选择“修改选取框->反选”
在编辑菜单中选择“清除”,即可删除背景,也可直接使用“Delete键”删除
到此就大功告成了,按“esc”即可取消选取框
浏览量:2
下载量:0
时间:
关于fireworks钢笔工具如何使用的问题,一般来说,在fireworks中,钢笔工具既可以绘制图形,也可以修改图形下面小编给大家整理了关于一些用fireworks钢笔工具的使用,希望大家喜欢。
开式路径画好后,可以对路径增加或减少节点,也可以调整节点或调整节点手柄来修改,那如何延长路径继续绘制,下面有一点心得:
如果某开式路径呈被选取状态,可以用钢笔工具对准路径某端的节点,此时钢笔工具右下角会出现“^”符号,单击节点,就可以对此条路径继续绘制,如果是想以曲线的方式继续绘制,可以对准节点拖动继续绘制;
如果某开式路径未被选取,可以用钢笔工具对准路径某端的节点的位置(其实看不到节点,对准路径末尾就行),此时钢笔工具右下角会出现“/”符号,单击路径末端,就可以对此条路径继续绘制,如果是想以曲线的方式继续绘制,可以对准节点拖动继续绘制。
看过“ fireworks钢笔工具的使用方法“的认还看了:
1.
浏览量:2
下载量:0
时间:
fireworks是一个非常好的色彩选取工具,程序提供的非常友好的界面,提供了多种色彩下面小编给大家整理了关于一些fireworks如何使用颜色混合模式的方法,希望大家喜欢。
使用“替换颜色”工具可以快速地将图像中的某些颜色转换为选定的另一种颜色,操作步骤如下:
(1)单击工具箱中的“替换颜色”工具按钮,如下图所示。
(2)按住Alt键,在要替换的颜色位置上单击鼠标。
(3)在“属性”面板中调整要替换的颜色和其他的参数。
(4)在要替换的颜色上拖动鼠标,进行替换。
设置“替换颜色”属性,操作步骤如下:
(1)单击工具箱中的“替换颜色”工具按钮。
(2)在其相应的“属性”对话框进行参数设置,如下图所示。
各选项的含义如下:
“大小”:在该文本框中可以直接输入要使用的“替换颜色”工具尺寸,或通过单击文本框右侧的下拉按钮,在弹出的框中拖动滑块调整“替换颜色”工具的尺寸。
“形状”:在该选项区域中,可以通过单击或按钮,将“替换颜色”工具的形状调整为相应的效果。
“从”:在该选项颜色框中选择要进行替换的颜色,也可以通过按住Alt键,按在图像中选取的方法进行定义。
“终止”:在该选项颜色框中选择要替换的颜色。
“容差”:在该选项中输入或调整数值,从而确定要替换的颜色范围。
“强度”:在该文本框中可以直接输入要使用的“替换颜色”工具的执行程度,或通过单击文本框右侧的下拉按钮,在弹出的框中拖动滑块调整“替换颜色”工具执行程度,当数值较大时,图像的变化程度较大,反之较小。
“彩色化”:当选中该选项时,使用“终止”选项中的颜色直接替换“从”选项中的颜色。当取消选择“彩色化”选项时,以便用“终止”选项中的颜色对“从”选项中的颜色进行涂染,并保持一部分“更改”选项中的颜色不变。
浏览量:2
下载量:0
时间:
使用Fireworks工具箱上的切片工具可以为已经制作好的图片创建切片。下面读文网小编跟分享了更多关于fireworks中如何使用切片工具,希望你喜欢。
1、在Fireworks CS3中打开制作好的网页效果图,如图所示。
在Fireworks CS3中打开制作好的效果图
【说明】效果图中的辅助线是在效果图设计之初就添加完毕的。
2、在fireworks中选择【切片】工具,对效果图进行切片,切片完成后的效果如图所示。
切片完成后的效果
【说明】切片的时候,尽量保证所有的切片和被切片的图像尺寸一致,不要切片大于或者小于被切片的图像,同时切片之间尽量保持不要重叠。
3、现在需要注意的地方来详细给大家说一下,首先是在内容区域,文本的前方有小的黑色三角箭头,这是用图像来制作的,所以必须要切片,但是由于所有文本前方的箭头图标都是一样的,所以只需要切一张即可。如图所示。
切片小图标
4、在这个效果图中,有很多的圆角效果,但是在切片的时候同样的效果仍旧只切片一张即可。如图所示。
切片圆角图像
5、切片完成后,在fireworks中选择的【2幅】窗口,如图所示。在这个窗口的左侧,是可编辑的原图,而在这个窗口的右侧,则是优化以后的图像。在这个窗口的下方,可以看到详细的关于每一个切片的文件量和下载时间等信息。
Fireworks的【2幅】窗口
6、按快捷键【F6】,打开Fireworks 的【优化】面板,使用【指针】工具,在【2幅】窗口的左侧依次选择切片,然后在【优化】面板中进行相应的优化操作,最终优化后的图像效果,可以在【2幅】窗口的右侧进行观察,如图所示。
对切片进行优化
7、在fireworks中对每一张切片进行优化后,就可以导出所有的图像素材了。选择【文件】@@【导出】命令(快捷键为【Ctrl+Shift+R】),会弹出Fireworks CS3的【导出】对话框,如图1-29所示。
Fireworks CS3的【导出】对话框
8、在fireworks中【导出】对话框中的【导出】下拉列表中选择【HTML和图像】选项,这样可以激活面板右下角的【选项】按钮,单击【选项】按钮,打开【HTNL设置】对话框,如图1-30所示。
【HTML设置】对话框
9、切换到【文档特定信息】选项卡,设置导出后所有切片的命名规则,可以使用文档名称加切片序号的方式来命名,这样做的目的是为了尽量让切片的名称变得简短,如果切片名称太长,在网页中写脚本的时候字符数量就会增加,网页文件的文件量也就会随之增加,如图所示。设置完毕后,点击【确定】按钮,返回【导出】对话框。在【HTML设置】对话框中选择【文档特定信息】选项卡
10、在fireworks中更改【导出】对话框中的【导出】类型为【仅图像】。这样导出以后只会根据切片来生成图像而不会生成网页,在【文件名】文本框中输入希望的文件名称,建议命名规则简单易记,如图所示。
Fireworks CS3的【导出】对话框
11、在fireworks中【保存在】下拉列表中选择需要保存的位置,习惯上我们会把所有切片生成的图像保存到站点的图像文件夹内。在【切片】下拉列表中选择【导出切片】,但是不要勾选下方的【包含无切片区域】和【当前页面】复选框,如图1-32所示。
12、全部设置完毕后,点击【保存】按钮即可把这个页面中的所有切片导出到Dreamweaver的站点中去了,生成的图像如图所示。
导出到站点中的切片
浏览量:2
下载量:0
时间:
在Fireworks或者是PhotoShop中设计好的网页效果图,需要导入到Dreamweaver中进行排版布局。在导入到Dreamweaver之前,可以使用Fireworks对效果图进行切片和优化,然后才能够把优化好的切片输出到Dreamweaver的站点中进行布局。切片的目的是为了获得图像素材,也就是说能够通过写XHTML语言脚本实现效果的部分,就不需要切片,而必须用图像的地方,则一定要切片。下面通过一个实例小编来给大家介绍一下Fireworks CS3的切片和优化功能,具体操作步骤如下:
1、在Fireworks CS3中打开制作好的网页效果图,如图1-23所示。
图1-23 在Fireworks CS3中打开制作好的效果图
【说明】效果图中的辅助线是在效果图设计之初就添加完毕的。
2、选择Fireworks CS3中的【切片】工具,对效果图进行切片,切片完成后的效果如图1-24所示。
图1-24 切片完成后的效果
【说明】切片的时候,尽量保证所有的切片和被切片的图像尺寸一致,不要切片大于或者小于被切片的图像,同时切片之间尽量保持不要重叠。
3、几个特别需要注意的地方来详细给大家说一下,首先是在内容区域,文本的前方有小的黑色三角箭头,这是用图像来制作的,所以必须要切片,但是由于所有文本前方的箭头图标都是一样的,所以只需要切一张即可。如图1-25所示。
图1-25 切片小图标
4、同样的道理,在这个效果图中,有很多的圆角效果,但是在切片的时候同样的效果仍旧只切片一张即可。如图1-26所示。
图1-26 切片圆角图像
5、切片完成后,选择Fireworks CS3中的【2幅】窗口,如图1-27所示。在这个窗口的左侧,是可编辑的原图,而在这个窗口的右侧,则是优化以后的图像。在这个窗口的下方,可以看到详细的关于每一个切片的文件量和下载时间等信息。
图1-27 Fireworks的【2幅】窗口
6、按快捷键【F6】,打开Fireworks CS3的【优化】面板,使用【指针】工具,在【2幅】窗口的左侧依次选择切片,然后在【优化】面板中进行相应的优化操作,最终优化后的图像效果,可以在【2幅】窗口的右侧进行观察,如图1-28所示。
图1-28 对切片进行优化
7、对每一张切片进行优化后,就可以导出所有的图像素材了。选择【文件】@@【导出】命令(快捷键为【Ctrl+Shift+R】),会弹出Fireworks CS3的【导出】对话框,如图1-29所示。
图1-29 Fireworks CS3的【导出】对话框
8、在【导出】对话框中的【导出】下拉列表中选择【HTML和图像】选项,这样可以激活面板右下角的【选项】按钮,单击【选项】按钮,打开【HTNL设置】对话框,如图1-30所示。
图1-30【HTML设置】对话框
9、切换到【文档特定信息】选项卡,设置导出后所有切片的命名规则,可以使用文档名称加切片序号的方式来命名,这样做的目的是为了尽量让切片的名称变得简短,如果切片名称太长,在网页中写脚本的时候字符数量就会增加,网页文件的文件量也就会随之增加,如图1-31所示。设置完毕后,点击【确定】按钮,返回【导出】对话框。
图1-31 在【HTML设置】对话框中选择【文档特定信息】选项卡
10、更改【导出】对话框中的【导出】类型为【仅图像】。这样导出以后只会根据切片来生成图像而不会生成网页,在【文件名】文本框中输入希望的文件名称,建议命名规则简单易记,如图1-32所示。
图1-32 Fireworks CS3的【导出】对话框
11、在【保存在】下拉列表中选择需要保存的位置,习惯上我们会把所有切片生成的图像保存到站点的图像文件夹内。在【切片】下拉列表中选择【导出切片】,但是不要勾选下方的【包含无切片区域】和【当前页面】复选框,如图1-32所示。
12、全部设置完毕后,点击【保存】按钮即可把这个页面中的所有切片导出到Dreamweaver的站点中去了,生成的图像如图1-33所示。
图1-33 导出到站点中的切片
所有的切片生成以后,就可以使用这些图像素材,在Dreamweaver CS3中进行排版布局了。
浏览量:2
下载量:0
时间:
今天小编给出的教程是讲述Fireworks钢笔工具简单钩制图片破损边缘的一个简单教程。希望对大家有所帮助吧!
浏览量:2
下载量:0
时间:
Fireworks怎么使用文字工具,是一款和ps功能差不多的工具,那这款软件怎么使用文字工具呢?下面下编来告诉你吧。
我们新建一个Fireworks文件
我们随便点一个,创建一个画布,点击确定创建一个空白画布
在左边的工具栏,找到A的图标,是文字工具
点击工具,我么直接输入文字就行了
下边的这些属性添加文字大小和其他设置的
浏览量:3
下载量:0
时间:
Macromedia Fireworks 8是Macromedia开发的图像软件,可以在直观、可定制的环境中创建和优化用于网页的图像并进行精确控制。那么下面读文网小编跟分享了更多关于fireworks怎么调出自动形状工具,希望你喜欢。
源文件下载 (36KB, Winzip压缩文件)
1、在编辑区插入一个圆角矩形的自动形状对象,通过调整“自动形状属性”面板,将其“宽、高”分别设为“110、150”,并且边角大小设为“31”左右即可。具体设置如下图:
3、编辑区的形状已经发生了变化,我们期待的“高脚杯”的形状已经基本出现了,如下图所示。
如果本步,我们对边角再作调整的话,配合“ALT”键,就可以作出下图所示的种种效果了,大家不妨自行试验一下,看看是否如此。
4、回过头来,我们继续前面“高脚杯”形状的制作。
选取工具箱的“部分选定”工具,在“高脚杯”形状的路径上单击鼠标,应该会出现如下图所示的警告框,不用管它,直接确定即可,如果嫌它烦的话,选中“不再显示此对话框”前面的复选框即可。
当然,还有一种好办法,更省事儿。那就是直接单击工具栏上的“合并”按钮,将自动图形对象转化为路径对象来操作,这样就更简单的说了。
5、剩下的工作就是对形状的下部做一个细微的调整了,可以使用“部分选定”工具,同时选定位于下方的三角形的三个路径节点,然后按键盘上的“向上”键,向上移动它,然后再对其高度做细微的调整,如下图所示。
6、最终成图,需要更进一步的细化,自行处理了,本节的“高脚杯”形状的制作,到此完毕。
浏览量:2
下载量:0
时间:
Fireworks是网页图形图像制作专业工具,网页中出现的任何图形、图像,Fireworks都能处理。那么下面读文网小编跟分享了更多关于fireworks怎么使用,希望你喜欢。
浏览量:2
下载量:0
时间:
Fireworks自由变形工具怎么用,我们用Fireworks时候怎么用自由变形工具呢?下面下编来告诉你吧。
打开我们的主程序
新建一个空白的画布
然后我们画一个简单的图形
我们点击修改--自由变形
然后我们拖到边角就可以变形了
浏览量:2
下载量:0
时间:
浏览量:2
下载量:0
时间:
Fireworks作为曾经的网页三剑客之一,虽然在cs6之后已经不再更新,但作为一个轻量的图片编辑工具,我依然十分喜欢它。那么下面小编教你怎么用fireworks的钢笔工具抠图。
选中右侧工具栏中的“钢笔”工具
使用钢笔工具勾选图片轮廓
将轮廓全部勾出,形成一个封闭的路径
右键选中路径,在弹出的菜单中选择“将路径转换为选取框”
在弹出的工具框中选择“消除锯齿”,也可以选择其它两种,留给大家自己尝试吧
右键单击选中选取框,选择“修改选取框->反选”
在编辑菜单中选择“清除”,即可删除背景,也可直接使用“Delete键”删除
到此就大功告成了,按“esc”即可取消选取框
浏览量:3
下载量:0
时间:
Fireworks是Macromedia公司发布的一款专为网络图形设计的图形编辑软件,它大大简化了网络图形设计的工作难度,无论是专业设计家还是业余爱好者,使用Fireworks都不仅可以轻松地制作出十分动感的GIF动画,还可以轻易地完成大图切割、动态按钮、动态翻转图等,因此,对于辅助网页编辑来说,Fireworks将是最大的功臣。借助于Macromedia Fireworks 8,您可以在直观、可定制的环境中创建和优化用于网页的图像并进行精确控制。Fireworks 业界领先的优化工具可帮助您在最佳图像品质和最小压缩大小之间达到平衡。它与 MacromediaDreamweaver和 MacromediaFlash共同构成的集成工作流程可以让您创建并优化图像,同时又能避免由于进行Roundtrip 编辑而丢失信息或浪费时间。利用可视化工具,无需学习代码即可创建具有专业品质的网页图形和动画,如变换图像和弹出菜单等。今天小编在这里给大家推荐一些fireworks软件学习视频相关文章,欢迎大家围观参考,想了解更多,欢迎来到读文网。
浏览量:3
下载量:0
时间:
Fireworks是Macromedia公司发布的一款专为网络图形设计的图形编辑软件,它大大简化了网络图形设计的工作难度,无论是专业设计家还是业余爱好者,使用Fireworks都不仅可以轻松地制作出十分动感的GIF动画,还可以轻易地完成大图切割、动态按钮、动态翻转图等,因此,对于辅助网页编辑来说,Fireworks将是最大的功臣。借助于Macromedia Fireworks 8,您可以在直观、可定制的环境中创建和优化用于网页的图像并进行精确控制。Fireworks 业界领先的优化工具可帮助您在最佳图像品质和最小压缩大小之间达到平衡。它与 MacromediaDreamweaver和 MacromediaFlash共同构成的集成工作流程可以让您创建并优化图像,同时又能避免由于进行Roundtrip 编辑而丢失信息或浪费时间。利用可视化工具,无需学习代码即可创建具有专业品质的网页图形和动画,如变换图像和弹出菜单等。今天小编在这里给大家推荐一些fireworks软件学习视频相关文章,欢迎大家围观参考,想了解更多,欢迎来到读文网。
浏览量:2
下载量:0
时间:
在Fireworks或者是PhotoShop中设计好的网页效果图,需要导入到Dreamweaver中进行排版布局。在导入到Dreamweaver 之前,可以使用Fireworks对效果图进行切片和优化,然后才能够把优化好的切片输出到Dreamweaver的站点中进行布局。切片的目的是为了获得图像素材,也就是说能够通过写XHTML语言脚本实现效果的部分,就不需要切片,而必须用图像的地方,则一定要切片。下面通过一个实例来给大家介绍一下 Fireworks CS3的切片和优化功能,具体操作步骤如下:
1、在Fireworks CS3中打开制作好的网页效果图,如图1-23所示。
图1-25 切片小图标
4、同样的道理,在这个效果图中,有很多的圆角效果,但是在切片的时候同样的效果仍旧只切片一张即可。如图1-26所示。新客网www.xker.com
图1-26 切片圆角图像
5、切片完成后,选择Fireworks CS3中的【2幅】窗口,如图1-27所示。在这个窗口的左侧,是可编辑的原图,而在这个窗口的右侧,则是优化以后的图像。在这个窗口的下方,可以看到详细的关于每一个切片的文件量和下载时间等信息。
6、按快捷键【F6】,打开Fireworks CS3的【优化】面板,使用【指针】工具,在【2幅】窗口的左侧依次选择切片,然后在【优化】面板中进行相应的优化操作,最终优化后的图像效果,可以在【2幅】窗口的右侧进行观察,如图1-28所示。
图1-28 对切片进行优化
7、对每一张切片进行优化后,就可以导出所有的图像素材了。选择【文件】@@【导出】命令(快捷键为【Ctrl+Shift+R】),会弹出Fireworks CS3的【导出】对话框,如图1-29所示。
图1-29 Fireworks CS3的【导出】对话框
8、在【导出】对话框中的【导出】下拉列表中选择【HTML和图像】选项,这样可以激活面板右下角的【选项】按钮,单击【选项】按钮,打开【HTNL设置】对话框,如图1-30所示。
图1-30【HTML设置】对话框
9、切换到【文档特定信息】选项卡,设置导出后所有切片的命名规则,可以使用文档名称加切片序号的方式来命名,这样做的目的是为了尽量让切片的名称变得简短,如果切片名称太长,在网页中写脚本的时候字符数量就会增加,网页文件的文件量也就会随之增加,如图1-31所示。设置完毕后,点击【确定】按钮,返回【导出】对话框。
图1-31 在【HTML设置】对话框中选择【文档特定信息】选项卡
10、更改【导出】对话框中的【导出】类型为【仅图像】。这样导出以后只会根据切片来生成图像而不会生成网页,在【文件名】文本框中输入希望的文件名称,建议命名规则简单易记,如图1-32所示。
图1-32 Fireworks CS3的【导出】对话框
11、在【保存在】下拉列表中选择需要保存的位置,习惯上我们会把所有切片生成的图像保存到站点的图像文件夹内。在【切片】下拉列表中选择【导出切片】,但是不要勾选下方的【包含无切片区域】和【当前页面】复选框,如图1-32所示。
12、全部设置完毕后,点击【保存】按钮即可把这个页面中的所有切片导出到Dreamweaver的站点中去了,生成的图像如图1-33所示。
图1-33 导出到站点中的切片
所有的切片生成以后,就可以使用这些图像素材,在Dreamweaver CS3中进行排版布局了
浏览量:2
下载量:0
时间: