我们的Fireworks教程全是原创作品，禁止复制转载做商业用途。一经发现武汉PHP家园将依法追求其法律责任。

　　Fireworks入门教程，我们首先要从总体上认识Fireworks打开画布后的整体界面及其基本特点。这样有利于让Fireworks学习达到循序渐进的效果。下图（图1-3-1）是我们打开Fireworks画布后看到的效果。中间的空白部分即为画布。

 图1-3-1 Fireworks绘图初始界面

　　图注说明：

　　（1）画布：画布是我们做图的地方，它如同一张白纸。我们所画的所有内容只要在白布上当然就是可见的。白色以外的灰色部分是非画布区域，它有时候会对我们做图起到一个辅助作用，并不是说我们的图像不能出现在灰色部分。只是灰色部分不可见罢了。也就是说有时候为了做图快速方便，你可以将多余的部分在画布以外的部分随意画都没有关系。你的画布有可能不是白色的，可能是灰色相间的小格子构成的。这些都不重要，重要的是它代表的意义不同。灰白相间的小格子画布代表的是Fireworks的画布是透明的，也就是说，如同你在一块透明的玻璃上画图，在灰白相间的小格子上所画的图，在保存成非PNG格式（关于格式，我们将在下一节进行介绍）的图片时，都有可能会自动变成白色的背景。而白色的画布就如同在一张白纸上做画，画的什么样，最终看到的就是什么样的。

　　（2）所有标注为2的区域内都有一条灰色的线，这些灰色的线将Fireworks工具条分成不同的区域。每一个区域代表一个不同的功能。

　　选择区域的工具可以用来选择画面上的元素。

　　位图区域的工具代表这些工具只能用来操作矢量图，下面的矢量代表只能操作矢量图。关于位图和矢量图的区别，我们将在下一节详细介绍。现在你只要明白他们的作用不同即可。

　　web区域的工具，通常是帮助我们将某一块的图像直接导出成一张独立的图片而设立的。对我们做网站大有帮助。即切片是一个非常好的东西。以后我们的Fireworks教程里也会详细讲解切片。

　　颜色区域的工具，主要用来调整所绘制的图像的边框和区域内的颜色。Fireworks的颜色面版看似简单，实际上有非常强大的功能。在以后的章节里，我们也会重点讲解。

　　视图区域的工具，主要是用来对画图的视觉效果做一下快速改成。对图像元素本身不会产生任何改变作用。主要是用来辅助我们做图的。

　　（3）该区域是Fireworks的最基本的一个属性面版，内容比较简单，画布旁边的方框是一个快速改变画面背景色的颜色面版。此面版只用来改变画布背景色。没有其它作用，而且它只能调出纯色背景，不能调多渐变即多种色彩混合的画布背景色出来。

        旁边的三个按钮，作用是非常大的。画布大小，用来改本现在画布的大小，比如现在的画布是200*200像素的，你可以将其变成500*300像素的。像素是绘图软件一个种单位，类似毫米。改变画布大小，不会改变图像元素本身的大小，只会改变白色背景的大小。图片大小与画布大小最大的不同时，整个图片会一起改变。如果是比较小的图片被改变了图像大小的话，图像有可能会变模糊。符合画布是一个更有意思的工具。如果你在200*200像素的画布里画了一幅100*50大小的图片，当你点一下符合画布的时候，它会自己将画布大小改变成100*50像素大小。这三个按钮非常适用，对我们做图有非常大的帮助。后面我们还会专门再讲解它的作用。

　　本文是Fireworks入门教程，Fireworks学习是一件非常有趣的事情。学会了Fireworks，对今后的网站开发工作将会大有帮助。在以后的工作中，你会发现因为你会做图，绘制自己想要的页面效果。你总是得心应手。特别是自己创业，亲自做一个网站，从前端到后端，你根本就不需要请人帮忙。很容易就实现了自己想要的效果。网站开发对你来讲将会变得非常有意义。当你看到一个成功的作品快速呈现在自己的面前时，你会有一种巨大的成就感。

第2节 网页设计起步-从零开始Fireworks学习历程

第4节 Fireworks的文件格式及什么是位图、矢量图