第6章旅游网站图像和媒体设置免费下载.ppt

　　本章将介绍有关图像和媒体的基本知识及其在网页中的应用。 第6章 旅游网站图像和媒体设置 学习目标 了解网页中常用图像的基本格式。 掌握插入图像和设置图像属性的方法。 掌握设置网页背景颜色和背景图像的方法。 掌握插入SWF动画、FLV视频和ActiveX视频的方法。 第1页/共23页 6.1　设计思路 本章接着继续制作“崂山旅游”网站的主页面，使用图像和媒体对其进行完善。首先将图像占位符“header”更换为图像，然后将图像占位符“linknav”删除，设置背景图像和链接文本，在网页主体部分的左栏和右栏中继续编排相应的内容，使其图文并茂，在中栏内插入swf动画。通过这些基本操作，网页将显得更美观。 第2页/共23页 6.2 使用图像 网页图像格式 替换图像占位符 设置背景 插入图像 设置图像属性 第3页/共23页 网页中图像的作用基本上可分为两种：一种是起装饰作用，如制作网页时使用的背景图像；另一种是起传递信息的作用，如新闻图像、人物图像和风景图像等，它与文本的地位和作用是相似的，甚至文本只有配备了相应的图像，才显得更生动形象。 目前，在网页中使用的最为普遍且被各种浏览器广泛支持的图像格式主要是GIF和JPG格式，PNG格式也在逐步地被越来越多的浏览器所接受。 6.2.1 网页图像格式 第4页/共23页 一、GIF图像 GIF格式（Graphics Interchange Format，图形交换格式，文件扩展名为“.gif”），是在Web上使用最早、应用最广泛的图像格式，具有图像文件小、下载速度快、下载时隔行显示、支持透明色以及多个图像能组成动画的特点。由于最多支持256种颜色，GIF格式最适合显示色调不连续或具有大面积单一颜色的图像，例如导航条、按钮、图标、徽标或其他具有统一色彩和色调的图像，不适合显示有晕光、渐变色彩等颜色细腻的图像和照片。 第5页/共23页 二、JPEG图像 JPEG格式（Joint Photographic Experts Group，联合图像专家组格式，文件扩展名为“.jpg”），是目前互联网中最受欢迎的图像格式。由于JPEG支持高压缩率，因此其图像的下载速度非常快。但随着JPEG文件品质的提高，文件的大小和下载时间也会随之增加。不过通常可以通过压缩JPEG文件在图像品质和文件大小之间达到良好的平衡。由于JPEG格式可以包含数百万种颜色，因此非常适合显示摄影、具有连续色调或一些细腻、讲究色彩浓淡的图像。 第6页/共23页 三、 PNG图像 PNG格式（Portable Network Graphics，可移植网络图形，文件扩展名为“.png”），是目前使用量逐渐增多的图像格式。PNG格式图像不仅没有压缩上的损失，能够呈现更多的颜色，支持透明色和隔行显示，而且在显示速度上比GIF和JPEG更快一些。同时，PNG格式图像可保留所有原始层、矢量、颜色和效果信息，并且在任何时候所有元素都是可以完全编辑的。由于PNG格式图像具有较大的灵活性并且文件较小，因此PNG格式对于几乎任何类型的网页图像都是非常适合的。不过PNG格式还没有普及到所有的浏览器，因此，除非用户是使用支持PNG格式的浏览器，否则最好使用GIF或JPEG以适应更多人的需求。 第7页/共23页 6.2.2 替换图像占位符 图像占位符是在将最终图像添加到网页之前使用的临时占位符号，在发布站点之前，应该将图像占位符替换成图像文件。 可以在【属性】面板中选中图像占位符，然后单击【源文件】文本框后面的 图标，也可直接双击图像占位符来打开【选择图像源文件】对话框，选择要替换图像占位符的文件。 当然，也可以将图像占位符直接删除，然后再插入需要的图像。 第8页/共23页 6.2.3 设置背景 通过创建CSS样式设置页面背景和局部区域背景比较方便，不仅能够设置背景图像的重复方式，而且还能够设置重复图像的位置等，可以说比传统的方法要灵活得多。 第9页/共23页 6.2.4 插入图像 图像除了用作网页背景外，更多的还是直接插入到网页中来传递信息。在【设计】视图中插入图像的方法总结起来主要有以下几种。 选择【插入】/【图像】命令来插入图像。 在【文件】面板中选中图像并拖动到文档中要插入图像的位置。 在【插入】面板的【常用】类别中单击（图像）按钮或将其直接拖动到文档中。 在【资源】面板中单击图标切换到【图像】类别，选中图像并单击（图像）按钮或者直接将图像文件拖动到文档中。 第10页/共23页 6.2.5 设置图像属性 插入图像后，图像自动处于选中状态，在【属性】面板中将显示图像的相关属性。可以根据需要重新设置图像属性，从而使图像更美观。 第11页/共23页 6.3 使用媒体 网页媒体类型 插入SWF动画 插入FLV视频