网页设计课件ch_4 图像处理072.pptVIP

第4章 图像的处理 学习目标 理解矢量图和位图的区别，了解常用的Web图像格式。 理解Web图像的处理流程，初步掌握基本的Web图像处理操作。 掌握在网页中插入图像的方法，理解图像在网页中的作用和Web图像的基本使用原则。 矢量图 矢量图形是指用线条和填充色等数学信息来描述图像的一种图像类型。 制作矢量格式图像的软件有 Freehand、Illustrator、CorelDraw、AutoCAD 。 位图 位图是指用像素一点一点地描述图像的一种图像类型。 常用的位图编辑软件有 Fireworks、Photoshop、ImageReady、PhotoImpact 等 常用Web图像格式 GIF JPEG PNG GIF GIF（Graphics Interchange Format，图形交换格式）格式的特点： 无损压缩 最多256色 能够使用透明色 有所占存储空间小、下载速度快、支持动画等特点 JPEG JPEG（Joint Photographic Expert Group，联合图形专家组）格式的特点： 有损压缩 24位颜色 可以控制压缩比 图像质量好，对具有连续色调的图像有最佳效果 PNG PNG（Portable Network Graphics，可移植的网络图形）格式的特点： 无损压缩 24位颜色 支持透明度 图像的取代文字 设定图像的高度和宽度 设定图像的边框 设定图像的对齐方式 设定图像与文本之间的距离 图像与超链接 图像既可以作为超链接的源，也可以作为超链接的目标。例如，Web相册。 图像映射（热点）：是指在同一幅图中定义若干区域，不同区域对应不同的超链接，单击不同区域可跳转到相应页面。 客户端图像映射 什么是客户端图像映射 在同一幅图中定义若干区域，不同区域对应不同的超链接，单击不同区域可跳转到相应页面。 右图中的汽车图像映射包括三个热点，每个热点均链接到一个单独的页面，该页面提供有关此特定功能（如挡风玻璃、前灯、或车轮和轮胎）的更多信息。 客户端图像映射 客户端图像映射的使用 （1）定义映射图 （2）使用映射图 定义映射图：map标记符和area标记符 使用映射图：img usemap=#映射图名称 AREA标记符 Shape属性（rect、circle、poly） Coords属性 Href属性 示例： HTMLHEADTITLE图像映射示例/TITLE/HEAD BODY MAP name=mymap AREA href=file1.htm shape=rect coords=“10,10,50,50 AREA href=file2.htm shape=rect coords=“50,50,100,100 /MAP P请单击以下图像中的不同区域，以便跳转到不同的文件/P PIMG src=“fh.jpg usemap=#mymap/P /BODY/HTML 在FrontPage2003中创建图像映射 在“页面”视图中文档窗口的底部，单击“设计” 。 单击要为其添加热点的图片。 如果“图片”工具栏被隐藏，请右键单击该图片，然后在快捷菜单上单击“显示图片工具栏”。 在“图片”工具栏上，单击“长方形热点” 　、“圆形热点” 　 或“多边形热点” 　。 在FrontPage2003中创建图像映射 在该图片上，执行下列操作之一： 绘制圆形?? 单击放置圆心，然后拖动鼠标至所需大小。 绘制长方形?? 单击以放置一个顶点，然后拖动鼠标至所需大小。 绘制多边形?? 单击以放置多边形的每个顶点，然后双击完成该形状。 释放鼠标按钮后，即会打开“插入超链接”对话框。 查找并选择希望有热点与之链接的文件，然后单击“确定”。 本章结束 * * BMP图像文件因为存储空间大，传输不够快，所以并不常用,常用的是jpg文件和gif文件。 对于徽标、公司厂标等在每一主页显示，要求能快速下载并能在低配置的系统中查询的图像,应采用GIF格式 而对于扫描图片、艺术作品这种对显示质量要求很高的图像则应采用JPEG格式。 图像使用说明 背景图案的设定 在网页中可以用图像平铺的方法制作背景。 定义背景图像的语法格式如下： body background=image-URL 其中，“image-URL”指图像的位置。 说明： 注意平铺的效果：在建立这种形式的背景之前，首先要确定所选定的图案能否看上去无痕迹地连接在一起，或者能否产生一种较好的背景效果。 尽量不用：用平铺图像作背景，将极明显地降低网页的显示速度。唯一的解决办法就是尽量使用小的图像文件，如果可能的话则不用。 img是用于导入图像文件的标签，使用此标签可将图像文件导入到HTML文件中显示。 img没有结束标签，