正确的图像切割
我正在寻求使用Fireworks 2.0进行图片切分的帮助。我尝试通过图片创建导航连接。这是一个很大，内部可设置的图片，我希望将内部效果做成单独的帧... 我想最好能给我提供一个有关切分图片的基础教程。 切分一个图片实际上会导致整个文件增大，并使页面的装载速度变慢。你也许会对此感到惊奇。除非你正确地设置了切分辅助线(slicing guides)，否则程序会自行加入大量的垫片(shims)以防止表格被破坏。过多的切片则意味着增加服务器端的负担。对图片的仔细切分以及对表格表现方式的一定了解会帮助你避免这些问题。 之所以引起表格紊乱，一个普遍原因就是按钮的安排不对称，而又试图将切分的图片环绕在其周围。在画图的时候，只要有可能，就应当考虑到使图片易于在整齐的行列中被切分。 一个被按钮分割的圆形是个很好的试验品，因为要充分利用被切割出来的部分是很困难的。http://it365cn.com/articleimg/188-1.gif
打开查看菜单(View menu)并选中标尺(Rulers)和网格(Guidelines)。在辅助线选项(Guide Options)下选择对齐辅助线(Snap To Guides)。 将辅助线拖曳到图片中间以标出待切分区域。继续添加辅助线来定义按钮切片的位置。
http://it365cn.com/articleimg/188-2.gif
http://it365cn.com/articleimg/188-3.gif
现在看起来出现了很多切片，不是吗？一共是27个，再加上垫片。目前这个图片的文件大小是3k。加上垫片会使文件的体积翻倍。 下一步你将要学会怎样安全地去除垫片，并将切片的数量减少到14。 为了避免垫片(shims)的自动生成，选择文件(File)>HTML属性(HTML Properties)。从表格(Table)选项的下拉菜单中选择单一表格(Single Table) - 无垫片(No Shims)。在FW 2中则是选择文件(File)>文档属性(Document Properties)>表格垫片(Table Shims)>无垫片(No Shims)。 激活切片工具，从工作区的左上角向下，用鼠标沿着辅助线创建切分单元。
http://it365cn.com/articleimg/188-4.gif
正如你在上图看到的那些红线，我为最左边一列的每一行都添加了辅助线，在中间创建出一个大的部分准备剪裁掉，为了减少切片的数量，在右边的一列中采取与中间列相同的操作。这个纵列与上面的横行将作为表格的垫片。 Fireworks 会自动给这些切片命名。如果你更喜欢自己来命名，取消对象面板(Object panel)中的自动命名切片(Auto-Name-Slices)并键入新的文件名。 导出： 从程序窗口中导出切片时FW 3 提供了一些导出选择。如果你希望使用它们，就在文档窗口预览图片，然后在优化面板(Optimize panel)中进行设置。否则，从文件(File)菜单中选择导出(Export)，在弹出的对话框中选择一个基本名称(base name)。剪切(Slicing)项选择\\\"使用剪切对象(Use Slice Objects)\\\"。选择一个HTML类型(HTML style)并选择一个路径存放文件。如果你要将图片放入另一个目录中，在FW 2中将出现一个对话框供你设置；而在FW 3中择从下拉菜单中选择\\\"上一层(One Level UP)\\\"以确定目录位置。 我喜欢从导出预览窗口(Export Preview window) 中导出文件，就像FW 2中的操作。当你点击导出按钮(export button)时，会弹出一个对话框。接下来的操作是相同的。
页:
[1]