Dreamweaver CS5.5中文版案例教程教学课件 作者 教学课件第4章4.ppt

《Dreamweaver CS5.5中文版案例教程教学课件 作者 教学课件第4章4.ppt》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、第4章添加图像和多媒体图像和文字都是组成网页的基本元素。与文字相比，使用图像更能够使HTML文档便于理解，更直观和生动。同时，使用图像还可以丰富网页内容，使网页页面更加美观，使得文档更加具有吸引力。所以，无论是个人网站还是商业网站，都需要有优秀的图像效果作为基础，以达到更好的网页设计宣传目的。相信通过本章的学习，读者一定能制作出漂亮的网页。4.1网页中常用的图像格式图像是网页中最常用的对象之一，制作精美的图像可以大大增强网页的视觉效果，令网页更加多姿多彩。在网页中恰当地使用图像，能够极大地吸引用户的眼球。因此，合理利用图像，是网页设计的关键。网页中常用的图像格式有3种，即GIF、JP

2、EG和PNG。目前GIF和JPEG文件格式的支持最好，大多数浏览器都可以查看这两种格式的文件。由于PNG文件具有较大的灵活性且文件较小，所以它对于几乎任何类型的网页图像都是最合适的。4.1网页中常用的图像格式4.1.1GIF图像格式GIF是英文单词GraphicInterchangeFormat的缩写，即图像交换格式，这种格式的文件最多使用256种颜色，最适合显示色调不连续或具有大面积单一颜色的图像，如导航条、按钮、图标、徽标或其他具有统一色彩和色调的图像。4.1网页中常用的图像格式4.1.2JPEG图像格式JPEG是英文单词JointPhotographicExpertsGroup

3、的缩写，它是一种图像压缩格式，文件格式是用于摄影或连续色调图像的高级格式，这是因为JPEG文件可以包含数百万种颜色。4.1网页中常用的图像格式4.1.3PNG图像格式PNG是英文单词PortableNetworkGraphic的缩写，即便携网络图像，是一种替代GIF格式的无专利权限制的格式，它包括对索引色、灰度、真彩色图像及Alpha通道透明的支持。PNG4.2制作图像页面4.2.1插入图像4.2制作图像页面4.2.2设置图像属性图像的“属性”面板用于显示图像的当前属性，可以通过改变“属性”面板中的各项设置改变图像的属性，在“设计”视图中选择一张图像，“属性”面板显示常用的图像属性。

4、单击“属性”面板右下角的扩展箭头，可以查看所有的图像属性。如果要设置图像大小和边距，先选中相应的图像，如果此时“属性”面板隐藏，可以通过选择“窗口”→“属性”菜单命令来打开“属性”面板，如图4-8所示。4.2制作图像页面4.2.3插入图像占位符属性有时根据页面的布局需要，要在网页中插入一幅图片。这个时候可以不制作图片，而是使用占位符来替代所要插入的图片位置。插入图像占位符的具体操作步骤如下。4.2制作图像页面4.2.4插入鼠标经过图像“鼠标经过图像”是网页特效中的一种。当鼠标指针经过一个图像时，图像的外观显示会变成另一种状态，这种变化可以是图像在颜色或形状上发生了改变，是一种互动效果

5、。当鼠标指针从图像上移走后，图像又恢复原状。4.3编辑图像裁剪、调整亮度/对比度和锐化等一些辅助性的图像编辑功能用Dreamweaver就能实现，编辑工具是内嵌的Fireworks技术。有了这些简单的图像处理工具，在编辑网页图像时就轻松多了，不需要打开其他图像处理工具进行处理，从而大大提高了工作效率。4.3编辑图像4.3.1使用Photoshop优化图像在Dreamweaver文档中选中图像，在“属性”面板中单击“编辑”按钮，即可在Photoshop中打开此图像文件，如图4-28所示。打开图像文件后，可在Photoshop中对图像进行优化处理包括裁剪、调整亮度/对比度、调整色相、模糊

6、等处理。4.3编辑图像4.3.2裁剪图像如果所输入的图像太大，还可以在DreamweaverCS5.5中使用“裁剪”按钮，裁剪图像的具体操作步骤如下。4.3编辑图像4.3.3调整图像的亮度和对比度亮度/对比度用于修改图像中像素的亮度或对比度，这将影响图像的高亮显示、阴影和中间色调。4.3编辑图像4.3.4锐化图像锐化将增加图像边缘像素的对比度，通常显示图像文件中的细节，经常需要锐化图像来提高边缘的对比度，使图像更为清晰。4.4制作多媒体页面现在的网页设计中，除了可以放置一些静止的图片外，动态效果也越来越多地被应用。Web页中的多媒体技术使因特网世界变得更加绚丽多彩。本章主要介绍在用D

7、reamweaver设计网页时如何使用音频、视频、动画、Java小程序及一些控件。4.4制作多媒体页面现在的网页设计中，除了可以放置一些静止的图片外，动态效果也越来越多地被应用。Web页中的多媒体技术使因特网世界变得更加绚丽多彩。本章主要介绍在用Dreamweaver设计网页时如何使用音频、视频、动画、Java小程序及一些控件。4.4制作多媒体页面现在的网页设计中，除了可以放置一些静止的图片外，动态效果也越来越多地被应用。Web页中的多媒体技术使因特网世界