网页设计第13讲.ppt

第13章 Fireworks 制作实例 Fireworks制作实例 我们将通过实例介绍如何利用Fireworks 8制作网页图片，通过它们进一步学习Fireworks 8工具和面板的灵活使用。 路径文字 如果希望文本不受矩形文本块的限制，可以绘制路径并将文本附加到它。文本将顺着路径的形状排列并且保持可编辑性。 将文本附加到路径后，该路径会暂时失去其笔触、填充以及效果属性。用户随后应用的任何笔触、填充和效果属性都将应用到文本，而不是路径。如果之后将文本从路径分离出来，该路径会重新获得其笔触、填充以及效果属性。 制作环绕文字 以下是制作环绕文字的具体步骤： 1．新建宽度为300像素，高度为200像素的文件，背景设为白色。 2．选择“工具”面板中的“文本”工具，在工作区输入文本“，字体选择“Arial Black”，字号为20像素大小，颜色为黑色，如图所示。 3．选择“工具”面板“矢量”部分的“椭圆”工具。 4．按住“Shift”键，在工作区画一个圆，并在“属性”检查器中设置新的宽度和高度值均为108。 制作环绕文字 5．单击“填充颜色框”图标，在颜色弹出窗口中点击“透明按钮”。 6．选中“描边”工具 ，在“描边种类”中选择“铅笔”|“1 象素柔化”。 7．按住Shift键，使用“指针”工具同时选择圆和文字。 8．打开“文本”菜单，单击“附加到路径”菜单命令，环绕文字效果如图所示。 制作环绕文字 9. 如果想旋转文字，选择“工具”面板中的“缩放工具”，出现圆形箭头，就可以旋转文字。 10．如果希望文本沿路径的内侧排列，选择“文本”菜单中的“倒转方向”。 11．打开另一幅图片，从其中复制徽标到圆的中心位置。 12．设置文本的颜色为#FF3300，并可根据内容尺寸重设画布大小。 13．单击“文件”菜单中的“保存”，将图像保存为例4.png。 蒙版效果 Fireworks 8中的蒙版能够隐藏/显示对象或图像的某些部分，可以使用蒙版技术在对象上实现许多种创意效果。 用矢量对象创建蒙版时，矢量对象的路径轮廓可用于剪贴或裁剪其它对象。当位图对象用作蒙版时，其像素的亮度或者其透明度会影响其它对象的可见性。 文本蒙版 文本蒙版是一种矢量蒙版。应用文本蒙版的方式与使用已有对象应用蒙版的方式一样：只需将文本用作蒙版对象即可。应用文本蒙版的常用方法是使用其路径轮廓，但也可以使用其灰度外观产生遮罩效果。 文字蒙盖图像效果 1．打开一幅原始图像（C:\Windows\Web\Wallpaper\Bliss.bmp） 2．使用“汉仪大黑简”字体输入文字“天高任鸟飞”，设置大小为96像素。 3．将文字的颜色改成白色，并为文字增加投影效果。设置投影的距离为7像素，颜色为白色，不透明度、柔化和角度均采用默认值。 文字蒙盖图像效果 4. 同时选中文字和图片，使用菜单命令中的“修改”|“蒙版”|“组合为蒙版”命令。 5．选择“修改”|“画布”|“修剪画布”菜单命令设置画布大小。 6．在“属性”面板中将默认导出选项设为“JPEG-较高品质”。 7．使用“文件”|“导出”菜单命令将图像保存为例5.jpg。 网页按钮 按钮是网页中的重要元素，以下通过实例讲解如何利用Fireworks 8制作按钮。 1．创建300×200像素新文档，绘制一个矩形，修改属性检查器面板中的矩形圆度值为100，将矩形四角转换成圆角样式。 2．将矩形宽度设为150，高度设为48，并用颜色#FF6600填充。 3．为此圆角矩形增加效果，单击属性检查器中增加效果按钮，弹出效果快捷菜单，然后选择“斜角和浮雕”|“内斜角”命令，设置斜角边缘形状为平坦，宽度为7像素，其它参数采用默认值，效果如图所示。 网页按钮 4．选择“滤镜”|“调整色彩”|“曲线”菜单命令，打开曲线对话框修改图像的光影层次效果。 用鼠标指标拖动曲线生成波浪形状，色彩可形成带有金属质感的效果。需要说明的是：在曲线调整之前，色彩的添加没有任何意义，因为在曲线编辑中会打乱色调。 网页按钮 5. 选择“滤镜”|“色彩调整”|“色相/饱和度”菜单命令，为按钮上色。 6．在制作好的按钮造型上，使用文本工具输入文字“BACK”，调整字体类型和大小，也可调整圆角矩形大小，并使二者居中对齐。 7．使用滴管工具吸取按钮中间色调，并为字体填充该色。选择效果菜单中的“斜角和浮雕”|“内斜角”命令，为字体添加凹陷的立体化效果。属性设置如图所示。 网页按钮 8．在属性面板上调整字体的透明度为85，使文本的凹陷效果显得更加自然逼真。 9．为按钮添加投影，设置距离为7像素，不透明度为32%，其他参数采用默认值。 制作弹出菜单 当用户将鼠标移动到某些网页对象上时，浏览器中将显示弹出菜单。用户可以将URL链接附加到弹出菜单项以便于导航。例如，可以使用弹出