Fireworks切片实例

  见很多网友问用PS和FW切片的问题,整理一实例,希望能对大家有所帮助。
  下图是我网站的导航条:

  接下来我们用“切片工具”(红圈内)来进行切图。
  根据颜色或其他你所想要的情况来进行切割,如下图:

  切片的好处:一、在网速较慢地情况下,本来要一张大图全部显示后才能看,现在切成众多小图后,速度加快,并且逐一显示;二、可根据每个切图的颜色和复杂情况进行不同的优化,以达到总体文件即保持必要清晰度,又能使文件达到最小,这是在大图时达不到的。

  将各切片优化后,选择"文件——导出",在导出对话框中,为文件取名,并请注意导也类型为“HTML和图象”,如图。

  OK,至此我们已经完成在FW中的工作。打开DW,新建一文件,在“对象面板”中选择“插入 Fireworks HTML”按钮:

  在弹出的对话框中点击“浏览”,选取刚才导出的HTML文件:

  你会发现刚才我们所切的图已经完整地在页面中:

  如果你把图片删除,你会发现这是一个table border="0" cellpadding="0" cellspacing="0"都为0的表格。

  好了,至此就全部结束。

时间: 2024-09-29 00:08:11

Fireworks切片实例的相关文章

如何使用fireworks切片功能

现有psd图片一张,内容是网站首页,想要把其中的各个图层转化成单个图片,即输出为html,以便在dreameweaver中编辑,该怎麽办? 我想用fireworks切片功能,但是图层太多,需要一个一个选中,再转化.有没有一种方法一次将所有图层都转化为切片? 1.首先保存好你的PSD文件. 2.打开FW. 3.打开你需要处理的PSD文件,理论上打开时应该出现出现提示框,问你是否保留PS文件的图层格式,如果选择保存的话,进入下一步. 4.按"Ctrl+A"全部选中编辑区的图形对象,按&qu

解决用Fireworks切片生成的垃圾代码的方法

用Fireworks切片切片生成了html文件后,会生成一些以前用手工一个个加入图片时而没有出现过的代码,比如在表格第一行就全部是类似<img src="/img/spacer.gif" width="*" height="1" border="0">的代码,然后在每一列最后面也出现类似<img src="/img/spacer.gif" width="1" heigh

Fireworks切片效果实例制作

整理一实例,PS和FW切片的问题,希望能对大家有帮助 下图是网站的导航条: 接下来我们用"切片工具"(红圈内)来进行切图. 根据颜色或其他你所想要的情况来进行切割,如下图: 切片的好处:一.在网速较慢地情况下,本来要一张大图全部显示后才能看,现在切成众多小图后,速度加快,并且逐一显示:二.可根据每个切图的颜色和复杂情况进行不同的优化,以达到总体文件即保持必要清晰度,又能使文件达到最小,这是在大图时达不到的. 将各切片优化后,选择"文件--导出",在导出对话框中,为文

Fireworks切片的交互性应用

切片最初的应用是将影响网页显示时间的大型图片切割成不同的几个部分以便于数据传输.随着Fireworks版本的升高,切片就成为了创建交互性网页的一个基本方法,现在利用切片就可以实现交互功能.下面就来介绍一下切片在网页中的交互性应用. 小知识:切片就是将图像切成很多不同的部分,它是一种网页对象,不是以图像形式存在,而是以HTML代码的形式出现.Photoshop也有切片功能,但相比网页制作工具Fireworks来说,无论在操作上和功能上都有一定的差距. 一.创建切片 开启Fireworks MX 2

Fireworks绘画实例:梵高之光

  要闪出一瞬的光辉必然要承受漫长的黑暗,梵高的一生充满了痛苦和挫折.也许他的漩涡型笔法就是这种生活的写照. 怀着这些心情,创作了<梵高之光>这副作品. 一.窗格子的取材材 窗格子的原型取材于fireworks颜色面板中的样本面板. 打开样本面板后,按下键盘的PrintScreen键,然后ctrl+v粘贴,使用"矩形选取框"在图片上截取一个4×4格子的颜色格子,然后将这个颜色格子转换为图形元件. 二.绘制窗格子 将格子的元件从"库"中拖放到画布上,然后用

GO语言数组和切片实例详解_Golang

本文实例讲述了GO语言数组和切片的用法.分享给大家供大家参考.具体分析如下: 一.数组 与其他大多数语言类似,Go语言的数组也是一个元素类型相同的定长的序列. (1)数组的创建. 数组有3种创建方式:[length]Type .[N]Type{value1, value2, ... , valueN}.[...]Type{value1, value2, ... , valueN} 如下: 复制代码 代码如下: func test5() {     var iarray1 [5]int32    

Fireworks 8实例绘制:娃娃贺岁图

快过年前我们给大家绘制了一个可爱小女孩的<娃娃放鞭炮>,自然联想到应该有这么一个小男孩,一起组成一幅<金童玉女>的画面.新春伊始,我们来绘制这样一个风格匹配的小男孩贺岁图,希望他能给大家带来最美好的祝福.文章末尾提供原文件供大家下载参考. 1.我们首先在Fireworks中新建一个大小为800×600的图像,大家都喜欢用红色来表示一种喜庆的气氛,在这里我们仍然将画布颜色自定义为红色,得到如图1所示的图像. 图1 设置画布颜色为红色 2.接下来我们就开始绘制小男孩了.首先是小男孩圆圆

Fireworks精彩实例:绘制星球

工具:fireworks 8.0滤镜:Eye CANDAY 4000(汉化版),fireworks自带的Edges滤镜,Aline skin xenofex2(汉化版)[注:除了Edges滤镜,其他滤镜则需另行安装到fireworks目录里的Plug-Ins文件夹内才可在fireworks中使用] 第一步:新建文件大小为600*650(也可以根据自己的喜好建立),画布颜色为透明.选择工具条里的"椭圆"工具(u)在画布里画一个圆形高宽分别为302*280充填颜色为(#666666)选择渐

微软Win XP图标 Fireworks 制作实例

微软 文章的题目使用了图标做法一例,而不是使用的制作方法详解,是因为考虑到了大家对于该图标的制作方法都可能有自己独特的方法,所以本节的内容就算是抛砖引玉之举吧!希望大家能够从中学到对自己有用的知识,我想这就足够了.教程开始之前,还是首先来看一个效果图,如下所示: 1.在编辑区绘制一个正方形对象,边长为90像素大小,填充颜色可自行设定,不要描边色,如下图所示. 2.选中矩形对象,选择工具箱的倾斜变形工具,向右侧方向拖动鼠标,拖动距离大概为正方形对象边长的1/4大小的距离即可,具体操作可参看下图所示