理论教育 网页设计与制作:图像切片技巧分享

网页设计与制作:图像切片技巧分享

时间:2023-11-04 理论教育 版权反馈
【摘要】:切片是指将Fireworks文档分割成多个较小的部分,并将每部分导出为单独的文件。图13-21使用选择工具创建矩形切片3.创建多个矩形切片在工具箱中单击“切片”工具按钮,在图像周围拖曳鼠标,就可以创建切片。图13-23使用多边形切片工具绘制切片图像切片完成后,既可以将切片导出为单独的图像,也可以导出为一个HTML文件和一系列图形文件。

网页设计与制作:图像切片技巧分享

切片是指将Fireworks文档分割成多个较小的部分,并将每部分导出为单独的文件。导出时,Fireworks还创建一个包含表格代码的HTML文件,以便在浏览器中重新装配图形。切片是Fireworks 8中用于创建交互的基本构造块。

1.图像切片的作用

切片是网页对象,即切片不是以图形的形式存在的,而是最终以HTML代码的形式出现。可以通过“层”面板中的“网页层”列表查看、选择和重命名它们,如图13-20所示。

图像切片的主要作用是:

(1)优化图像。网页图形设计的目的是在确保图形快速下载的同时保证质量。切片使用户可以使用最适合的文件格式和压缩设置来优化每个独立的切片。

(2)交互性。用户可以使用切片来创建响应鼠标事件的区域。

(3)更新网页的某些部分。切片使用户可以轻松地更新网页中经常更改的部分,例如,某水果公司的网页中可能包含每月更改一次的“本月销售冠军”部分,切片使用户可以快速更改销售冠军的姓名和照片而不用更换整个网页。

图13-20 切片所在的网页层

2.创建矩形切片

矩形切片的创建步骤如下:

(1)单击“文件”菜单→“打开”命令,打开编辑的图像文件。

(2)在工具箱中单击“选取框”工具按钮,在图像上拖出一个矩形区域。

(3)单击“编辑”菜单→“插入”→“矩形切片”命令。(www.daowen.com)

切片创建后,切片的周围显示红色的线条,它确定导出时将文档拆分成的单独图像文件的边界。切片区域将被覆盖上一层半透明的绿色,切片的中央有一个按钮,右击它,在快捷菜单中可以将切片导出,如图13-21所示。

图13-21 使用选择工具创建矩形切片

3.创建多个矩形切片

在工具箱中单击“切片”工具按钮,在图像周围拖曳鼠标,就可以创建切片。反复执行这个操作可以创建多个矩形切片,如图13-22所示。

图13-22 使用矩形切片工具创建切片

4.创建多边形切片

在工具箱上单击“多边形切片”工具按钮,在图像上依次点选多边形的各个顶点,即可绘制出一个多边形不规则形状的切片,如图13-23所示。

图13-23 使用多边形切片工具绘制切片

图像切片完成后,既可以将切片导出为单独的图像,也可以导出为一个HTML文件和一系列图形文件。

免责声明:以上内容源自网络,版权归原作者所有,如有侵犯您的原创版权请告知,我们将尽快删除相关内容。

我要反馈