网页制作教程 教学课件 ppt 作者 赵丰年 1_中文ppt 3使用图像

上传人:E**** 文档编号:89493031 上传时间:2019-05-25 格式:PPT 页数:41 大小:573.50KB
返回 下载 相关 举报
网页制作教程 教学课件 ppt 作者  赵丰年 1_中文ppt 3使用图像_第1页
第1页 / 共41页
网页制作教程 教学课件 ppt 作者  赵丰年 1_中文ppt 3使用图像_第2页
第2页 / 共41页
网页制作教程 教学课件 ppt 作者  赵丰年 1_中文ppt 3使用图像_第3页
第3页 / 共41页
网页制作教程 教学课件 ppt 作者  赵丰年 1_中文ppt 3使用图像_第4页
第4页 / 共41页
网页制作教程 教学课件 ppt 作者  赵丰年 1_中文ppt 3使用图像_第5页
第5页 / 共41页
点击查看更多>>
资源描述

《网页制作教程 教学课件 ppt 作者 赵丰年 1_中文ppt 3使用图像》由会员分享,可在线阅读,更多相关《网页制作教程 教学课件 ppt 作者 赵丰年 1_中文ppt 3使用图像(41页珍藏版)》请在金锄头文库上搜索。

1、1,Web编程基础,使用图像,2/41,学习目标,理解矢量图和位图的区别,了解常用的Web图像格式。 理解Web图像的处理流程,初步掌握基本的Web图像处理操作。 掌握在网页中插入图像的方法,理解图像在网页中的作用和Web图像的基本使用原则。,3,Part 1,Web图像基础,4/41,矢量图与位图,矢量图形是指用线条和填充色等数学信息来描述图像的一种图像类型。 制作矢量格式图像的软件有 Freehand、Illustrator、CorelDraw、AutoCAD 。,5/41,演示Flash动画的效果,6/41,矢量图与位图,位图是指用像素一点一点地描述图像的一种图像类型。 常用的位图编辑软

2、件有 Fireworks、Photoshop、ImageReady、PhotoImpact 等。,7/41,常用Web图像格式,常用的Web网页图像格式包括: GIF JPEG PNG,8/41,GIF,GIF(Graphics Interchange Format,图形交换格式)格式的特点: 无损压缩 最多256色 能够使用透明色 交错式Gif(interlaced gif) 动画Gif,9/41,演示透明GIF效果,10/41,JPEG,JPEG(Joint Photographic Expert Group,联合图形专家组)格式的特点: 有损压缩 没有颜色限制 可以控制压缩比 渐进式JP

3、EG(progressive JPEG),11/41,演示不同质量的JPEG,12/41,PNG,PNG(Portable Network Graphics,可移植的网络图形)格式的特点: 无损压缩 没有颜色限制 支持透明度,13/41,常用图像处理软件,Windows 画图 照片编辑器 PhotoShop PhotoDraw Fireworks,Freehand CorelDraw Illustrator Visio,14/41,使用网页图像的要点,确保文件较小 使图像具有所需的像素大小 采用正确的格式进行优化处理 控制图像的数量和质量 重复使用图像 合理使用动画,15/41,Web 图像的

4、处理流程,打开或创建图像 修改图像和添加图像效果 创建Web对象 优化图像 导出图像,16,Part 2,常用图像处理,17/41,如何获得图像素材?,直接在网上下载 使用图像资源光盘 自行创建 使用图形图像软件 使用扫描仪 使用数码相机 捕捉屏幕图像,18/41,演示下载网页中的图像,1、下载 2、优化 3、使用,19/41,演示使用图像资源光盘,1、获取 2、优化 3、使用,20/41,演示捕捉屏幕图像,1、捕捉(使用【Print Screen】或【Alt + Print Screen】) 2、优化 3、使用,21/41,演示修改图像大小,page53,22/41,演示图像的优化与导出,p

5、age53,23,Part 3,在网页中使用图像,24/41,在网页中插入图像,IMG 标记符 Src 属性用于指定要插入的图像的文件名(包括路径) Alt 属性表示图像的简单文本说明,25/41,演示插入图像,26/41,在网页中插入图像,IMG 标记符 WIDTH 和 HEIGHT 属性指定图像的显示大小 BORDER 属性指定图像的边框,27/41,演示width和height属性,28/41,在网页中插入图像,IMG 标记符 align属性设置对齐方式 hspace属性设置水平方向的空白 vspace属性设置垂直方向的空白,29/41,演示hspace和vspace属性,30/41,使

6、用动画gif,什么是动画gif 一系列的图像按累进顺序排列,每个图像的显示与前面一个图像有所不同,当这些图像连续显示时,动画效果就产生了。 在网页中插入动画gif 与插入普通图片一样用IMG标记符,31/41,演示动画gif的效果,32/41,演示动画gif的原理,在 Fireworks 中打开刚才的动画文件,33/41,图像与超链接,图像既可以作为超链接的源,也可以作为超链接的目标。例如,Web相册。 图像映射是指在同一幅图中定义若干区域,不同区域对应不同的超链接,单击不同区域可跳转到相应页面。,34/41,演示图像链接效果,35/41,客户端图像映射,什么是客户端图像映射 在同一幅图中定义若干区域,不同区域对应不同的超链接,单击不同区域可跳转到相应页面。 客户端图像映射的使用(1)定义映射图(2)使用映射图,36/41,客户端图像映射,定义映射图:标记符和标记符 使用映射图:,37/41,AREA标记符,Shape属性(rect、circle、poly) Coords属性 Href属性,38/41,演示图像映射效果,39,Part 4,作业2:在网站中增加图像,40/41,要求,至少6页,在第一次作业的基础上制作。 导航结构要清楚。 合理使用图像对网站进行修饰。 所有图像文件都存放在images子目录中。,41/41,Thats all for this chapter!,

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 高等教育 > 大学课件

电脑版 |金锄头文库版权所有
经营许可证:蜀ICP备13022795号 | 川公网安备 51140202000112号