第4章 使用图像和媒体.ppt

　　　本章将介绍有关图像和媒体的基本知识及其在网页中的应用。 第4章　使用图像和媒体 学习目标 了解常用图像的基本格式。 掌握插入和设置图像的方法。 掌握插入图像占位符的方法。 掌握设置网页背景的方法。 掌握插入Flash动画的方法。 掌握插入图像查看器的方法。 掌握插入ActiveX视频的方法。 4.1　认识网页常用图像格式 GIF图像 JPEG图像 PNG图像 4.1.1　GIF图像 GIF格式（Graphics Interchange Format，图像交换格式，文件扩展名为.gif）是由Compuserve公司提出的与设备无关的图像存储标准，也是在网页上使用最早、应用最广泛的图像格式。该格式图像具有文件小、下载速度快、下载时隔行显示、支持透明色以及多个图像能组成动画的特点，是网页制作中首选的格式。由于最多只支持256色，因此适合对色彩要求不高的图像，不适合于有晕光、渐变色彩等颜色细腻的图像和照片。 4.1.2　JPEG图像 JPEG格式（Joint Photographic Experts Group，联合图像专家组文件格式，文件扩展名为.jpg）是目前互联网中最受欢迎的图像格式。该格式可以设置图像质量，其图像大小由其质量的高低决定，质量越高文件越大，质量越低文件越小。在多数图像处理软件中（如Photoshop、Fireworks和Paintshop等）都可以设置JPEG文件的大小，使其介于最低图像质量和最高图像质量之间。因此，该格式比较适合显示色彩较绚丽、质量要求较高的图像，如照片、油画和一些细腻、讲究色彩浓淡的图像。由于JPEG支持很高的压缩率，其图像的下载速度也非常快。 4.1.3　PNG图像 PNG格式（Portable Network Graphics，便携式网络图像，文件扩展名为.png）是最近使用量逐渐增多的一种图像格式。该格式图像的优点是，在压缩方面能够像GIF格式的图像一样没有压缩上的损失，并能像JPEG那样呈现更多的颜色。而且PNG格式也提供了一种隔行显示方案，在显示速度上比GIF和JPEG更快一些。同时PNG格式图像又具有JPEG格式图像没有的透明度支持能力。虽然PNG格式图像还没有普及到所有的浏览器，但在未来它有可能是一种非常受欢迎的图像格式。 4.2 在网页中应用图像 插入图像 设置图像属性 4.2.1 插入图像 插入图像主要有以下几种途径。 选择【插入记录】/【图像】命令。 在【插入】/【常用】工具栏中单击（图像）按钮或将其拖动到文档中。 在【文件】面板中选中图像并拖动到文档中。 在【资源】面板中选中图像并单击【插入】按钮或直接拖动到文档中。 图像的HTML标签格式是：“img src=images/wyx04.jpg width=200 height=180” 其中，“img”是图像标签，属性“src”表示图像文件的路径，“width”表示图像的宽度，“height”表示图像的高度。 4.2.2 设置图像属性 选中图像，将显示图像【属性】面板。在【属性】面板中，可以设置图像名称、大小、替换文本、边距、边框、图文混排方式等。 4.3 插入图像占位符 图像占位符作为临时代替图像的符号，是在网页设计阶段使用的重要占位工具。读者可以随意定义其大小，并且放置在预插入图像的位置，用自定义的颜色来代替图像。在有了合适的图像后，可以通过图像占位符【属性】面板的【源文件】文本框设置实际需要的图像文件，设置完毕后图像占位符将自动变成图像。 插入图像占位符的方法是，选择【插入记录】/【图像对象】/【图像占位符】命令，或在【插入】/【常用】面板的【图像】下拉按钮组单击（图像占位符） 按钮，打开【图像占位符】对话框进行设置即可。 4.4 设置网页背景 设置背景颜色 设置背景图像 4.4.1 设置背景颜色 选择【修改】/【页面属性】命令，打开【页面属性】对话框，在【外观】分类中设置背景颜色 4.4.2 设置背景图像 打开【页面属性】对话框，在【外观】分类中设置背景图像和重复方式。 4.5　在网页中插入媒体 插入Flash动画 插入图像查看器 插入ActiveX 4.5.1　插入Flash动画 在Dreamweaver CS3中插入Flash动画的方法通常有以下3种。 选择【插入记录】/【媒体】/【Flash】命令 在【插入】/【常用】工具栏中单击 （媒体）按钮，在弹出的下拉按钮组中单击 （Flash ）按钮 在【文件】/【文件】面板中选中文件，然后拖动到文档中 4.5.2　插入图像查看器 插入图像查看器的方法是： 选择【插入记录】/【媒体】/【图像查看器】命令，插入Flash占位符。在文档中右键单击Flash占位符，在弹出的快捷菜单