第三章使用图像.pptVIP

第三章 使用图像 3.1 网页图像基础 一、位图与矢量图的概念 位图图形由排列成网格的称为像素的点组成 矢量图形使用称为矢量的线条和曲线描述图像 二、网页图像格式 常用的有GIF、JPEG、PNG格式 GIF（高度压缩图像；具有透明色的特点；支持动画的效果） JPEG格式（支持颜色数几乎没有限制；有损压缩；不支持透明色也没有动画） PNG格式（适合任何颜色任何类型的图片表现力更强；无损压缩，压缩率小图片大；支持透明度（0％到100％）） 3.1 网页图像基础 三、使用网页图像的要点 确保文件较小 控制图像的数量和质量 合理使用动画（不超过三处为益） 3.2 图像处理基本操作 一、Fireworks的界面 标题栏 菜单栏 工具栏（主要、修改） 状态栏（最底部，显示当前编辑文档的状态） 工具面板或工具箱（选择；位图；矢量；Web；颜色；视图） 文档窗口（四种状态显示模式） 面板组 属性面板或属性检查器 二、修改图像大小 图像的大小一般指图像的像素大小，是指由图像本身的像素的宽和像素的高确定的图像的大小。 步骤：修改/画布/图像大小/设置对话框 3.2 图像处理基本操作 三、用适当的格式导出图像 优化导出为GIF 打开图像 窗口/优化/设置 预览优化后的图像效果 文件/导出/保存 将图像优化导出为透明的GIF 打开图像（单一背景色） 进入预览视图（2幅） 窗口/优化/GIF文件格式：透明弹出菜单选择索引色透明 左下角（添加颜色到透明效果中） 文件/导出/保存 3.2 图像处理基本操作 三、用适当的格式导出图像 优化导出为JPEG格式 方法同上 图像质量与文件大小的关系 平滑（减小文件大小的有效手段） 3.2 图像处理基本操作 四、制作GIF动画 动画的基本原理（即视频的基本原理） 示例：球体下落并弹起的示例 3.3 图像标记符IMG 一、插入图像 使用IMG标记符，插入图像。必须属性：src（标识图像文件的位置）和alt（图像的简单文本说明） 示例 3.3 图像标记符IMG 二、设置图像属性 指定图像的宽和高（width和height）示例 图像的边框（border）示例 设置图像周围的空白（hspace和vspace）示例 图像的对齐 图像在页面中的对齐（使用DIV或P标记符将IMG标记符括起来然后使用align属性） 图像与周围内容的垂直对齐（IMG标记符中的align属性，值包括：top；middle；bottom（默认））示例 注：align＝“middle”无法完成垂直居中对齐，须使用非标准属 性值：absmiddle 3.3 图像标记符IMG 二、设置图像属性 图文混排时的图像对齐，使用IMG标记符中的align属性（left和right） 示例 3.4 使用图像映射 一、什么是图像映射 是指在一幅图中定义若干个区域（这些区域被称为热点，也就是hotspot）每个区域中指定一个不同的超链接，当单击不同区域时，便可以跳转到相应的目标页面。 二、创建图像映射 定义映射区域 MAP name＝“mymap”添加映射区域信息/MAP 添加映射区域 AREA（没有结束标记符）包含三个属性： Href：标识链接的目标文件 Shape：标识映射区域的形状（rect；circle；poly；default） Coords：标识映射中的区域边界 3.4 使用图像映射 对映射区域进行引用 在IMG标记符中使用usemap属性，属性的值等于MAP标记符中name属性值（加＃）。 示例: 网页上常用的图形格式 JPEG GIF * * 示例 图片比较 返回 *