边用边学Dreamweaver网页设计与制作教学课件 作者 李彪 杨仁毅 第5章.pptVIP

边学边用Dreamweaver CS4网页制作 教师： 职务： ——教育部实用型信息技术人才培养系列教材 第5章 网页中的图像处理 学习目标： 图形图像是网页吸引浏览者眼球的重要部分，恰当地使用图像既能达到美化网页的目的，又能够更好地传递信息。本章中将学习在网页中插入鼠标经过图像、设置网页背景以及创建图像映射的方法。通过本章的学习，读者可以熟练掌握图像在网页设计中的作用，及制作不同网页图像对象的方法和技巧。 第5章 网页中的图像处理 本章知识点： 网页中常用的图像格式 插入图像 鼠标经过图像 网页背景 图像映射 网页导航条 为网页图像不同部分分别添加超级链接 第5章 网页中的图像处理 第5章 网页中的图像处理 第5章 网页中的图像处理 第5章 网页中的图像处理 第5章 网页中的图像处理 第5章 网页中的图像处理 第5章 网页中的图像处理 第5章 网页中的图像处理 第5章 网页中的图像处理 * 5.1 网页中常用的图像格式 图片有多种格式，如：JPG、BMP、TIF、GIF、PNG等。互联网上大部分使用JPG和GIF两种格式，因为它们除了具有压缩比例高的优点外，还具有跨平台的特性。 1． GIF 2． JPG 3． PNG 5.2 插入图像 一个好的网页除了文本之外，还应该有绚丽的图片来渲染，在页面中恰到好处的使用图像能使网页更加的生动、形象和美观。图像也是网页中不可缺少的元素。 1．在网页中插入图像 2．设置图像属性 5.3 鼠标经过图像 鼠标经过图像是在浏览器中当鼠标指针移过它时发生变化的图像。使用鼠标经过图像可以制作交互式的图像特效。 5.4 网页背景 在Dreamweaver CS4中，设置网页背景有两种方法：一种是设置背景颜色；另一种是设置背景图像。 5.4.1 网页背景颜色 通过设置网页背景颜色，可以使网页看起来色彩感更强，页面更加漂亮。 5.4.2 网页背景图像 在Dreamweaver CS4中也可以为网页文档设置背景图像。 5.5 图像映射 图像映射是将图像划分为若干个区域，每个区域被称为一个热区。在Dreamweaver CS4中，热区可以是不同的形状，例如圆形、矩形、不规则多边形等。 5.6 应用实践 任务1——网页导航条 本例制作一个动感漂亮的网页导航条。首先通过设置页面属性为网页添加背景图像，然后通过插入鼠标经过图像为网页添加鼠标移动到图像上产生相应的交互效果，使导航条看上去不但精美而且充满动感，如下图所示。 5.6 应用实践 任务2——为网页图像不同部分分别添加超级链接 本例制作一个为网页图像不同部分分别添加超级链接的效果。首先通过设置页面属性为网页添加背景颜色，然后在网页中插入一幅图像，最后要为图像添加多个超级链接，将图像上的左眼处的热点链接设置为“/”，并输入替换文字“新浪网站”，将图像上的右眼处的热点链接设置为“/”，并输入替换文字“搜狐网站”，如下图所示。 5.7 知识拓展 5.7.1 图像占位符 图像占位符是一种临时的、替补的图形。用户不仅可以设置图像占位符的大小和颜色，还可以为图像占位符提供文本标签。 1．插入图像占位符 2．将图像占位符替换为图像 5.7.2 设置外部图像编辑器 设置外部图像编辑器可以更好的编辑网页中的图像。