网页中图形图像的高级.ppt

《网页中图形图像的高级.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第14章网页中图形图像的高级应用图形和图像都是图片。图形注重“形”，是一个一个由线构成的几何图形，也许是曲线又或者是直线做出的图片，它属于矢量图，通常以.bmp扩展名进行命名，指由GPU运算生成的几何图形或几何图形集合。图像可以是一幅画，它注重“色彩”，属于位图，通过以.jpeg、.tiff为扩展名进行命名，指已经由软硬件处理过的图形。本章针对图形图像具体进行有关内容的探讨。14.1矢量图形计算机中显示的图形可以分为位图和矢量图二类。矢量图无论放大、缩小或旋转等都不会失真，一般体积较小。正因为矢量图的这些特点，越来越多的网站在制作网页时选择使用矢量图作为页面图片。Adobe

2、公司的Illustrator、Corel公司的CorelDRAW是众多矢量图形设计软件中的佼佼者。这一节通过矢量图的制作过程，来介绍有关矢量工具。14.1.1认识矢量图形因为矢量图放大后，图像效果不会失真，所以在Flash制作等一些要求高保真的场合，它被人们广泛应用着。同时，矢量图还具有占用空间小的特点，同样的条件下由于网页制作的需求，人们更多地会选择它。并且，此类图形还不受分辨率的限制。矢量图以几何图形居多，图形可以无限放大，不变色、不模糊。常用于图案、标志、VI、文字等设计。常用软件有：CorelDraw、Illustrator、Freehand、XARA等。1．什么是

3、矢量图形矢量图形又常被称作面向对象图形或绘图图形。矢量文件中的图形元素称为对象。每个对象都是一个自成一体的实体，它具有颜色、形状、轮廓、大小和屏幕位置等属性。多次移动和改变它的属性，并不会影响图例中的其它对象。如图所示，是一矢量图形的应用实例。2．分辨率与“我”何干在处理位图时，我们知道需要重点考虑分辨率这一因素，但是矢量图会告诉你，分辨率与“我”何干哦？操作位图时，分辨率既会影响最后输出的质量也会影响文件的大小。但是，在矢量图这里，分辨率是没办法影响它的。3．开放路径对象和封闭路径对象对象可以有一条封闭路径或者一条开放路径。开放路径对象的两个端点是不相交的。封闭路径对象就

4、是那种两个端点相连构成连续路径的对象。开放路径对象既可能是直线，也可能是曲线，封闭路径对象包括圆、正方形、网格、自然笔线、多边形和星形等。封闭路径对象是可以填充的，而开放路径对象则不能填充。14.1.2制作矢量图形在Flash动画中，经常通过矢量图形来进行相关应的动态图的效果的实现。在对矢量图形有了初步认识之后，接下来让我们一起来学习有关绘制与填充。对于矢量图形，经常需要使用Fireworks软件来制作。它的处理主要包括有以下内容：1．矢量路径这里提到的矢量路径共有三类，分别是直线、曲线、自由路径。有关它们的创建方法，下面进行详细讲述。具体内容包括：（1）直线的创建方法（2

5、）曲线的创建方法（3）自由路径的创建方法2．矢量形状矢量形状包括矩形、椭圆、多边形、星形以及其它特定的几何形状。在Fireworks中主要提供有如图所示的相应关于形状的功能。在下面的内容中将详细为大家介绍有关此方面的操作、创建方法。（1）矩形的创建方法（2）椭圆形的创建方法（3）多边形的创建方法（4）星形的创建方法（5）特定形状的创建方法3．自动形状创建自动形状的方法是，单击“窗口”

6、“自动形状”命令，在弹出的如图1所示的“自动形状”面板中进行相应图形的拖动选择，即可实现。如图2所示，是应用“自动形状”面板实现的，可用于网页制作的部分矢量图形的效果图。图1图24．使用笔触笔

7、触可以应用到矢量路径、矢量图形或文本上。通过设置笔触属性，可以使下一个绘制的矢量对象具有新的笔触属性。具体操作方法是，在画布上选择一个矢量图形，鼠标单击“属性”面板中笔触的相应选项进行设置即可。如图所示，是矩形矢量图的相应的笔触的属性，包括边缘、纹理、圆度等。如图所示，是一针对笔触的相应属性效果应用后的矢量图。通过笔触分别实现了实线、3D、彩色蜡笔、轮廓和荧光等下述效果。5．使用填充在Fireworks内置了４种标准填充方式：单色填充、抖动填充（Web仿色填充）、图案填充和渐变填充。可以改变填充的各种属性，包括颜色、边缘、纹理和透明度。因为不同标准的填充方式略有区别，所以在

8、属性面板的设置操作时，除了基本操作外，还需要根据不同的方式进行相应的变动。下面针对这些进行具体介绍。（1）单色填充单色填充是使用单一颜色对矢量路径、图形或文本进行填充。具体操作方法是，在“属性”面板中，“填充”的相应选项中进行设置即可，如图所示。如图所示，是应用了单色填充的效果截图，在网页制作过程中，在矢量图的制作与应用时，可作为大家的参考。（2）抖动填充Fireworks提供了Web仿色填充，即混合两种Web可靠颜色来模拟一种非可靠的Web颜色。关于抖动填充的具体操作方法是，选择要填充的对象，在填充面板的类别下拉