网页中插入图片

【导语】刀豆文库的会员“半城煙沙”为你整理了“网页中插入图片”范文，希望对你的学习、工作有参考借鉴作用。

                              第5课、网页中加入图片                            本课时教学目的和要求 1、学会在网页中添加合适的图像，丰富网页中的信息。2、培养学生的美感。本课时教学重点和难点：1、在网页中插入图像。2、网页中图像属性的设置。教学过程 欣赏作品         学生欣赏两张教师提前制作好的网页：一张全文本，一张插入了美丽的图像。学生说说当你看了这两张网页后，你的感觉如何？                   学生： 纯文本的网页过于单调，而在文本的基础上，向网页中添加一些色彩绚丽的                             图片，产生图文并茂的显示效果，页面就会更加生动、富有吸引力。导入新课         由学生的回答，导入新课（板书课题）复习旧知      1、你还记得以前在POWERPOINT97和WPS2000中如何插入图片。2、上学期我们学过的多媒体的制作中，A、图片获得的途径有哪些？                         自行绘制、数码相机拍摄、扫描仪扫描、网上下载、抓图软件抓取。B、用哪个软件可以对图片进行简单的处理？                    C、用什么软件进行浏览图片？ 讲授新课     一、出示任务               1、[出示任务] 在保护动物网页中加入图片。2、[分析任务] 板书                    A、打开网站                    B、插入图片（寻找图片路径）C、修饰图片                    D、保存网页  二、学生带着问题看书上机操作，完成任务         首先观察：状态栏中的传输速率和时间，时间为0，说明无图片，加入图片后再观察数值。（图片下载时间）同时思考问题，以便回答：            1、在网页中插入图片的方法；            2、在网页中使用的图像格式有哪些？            3、可对图片进行哪些属性的调整。&强调   A、出现问题，举手询问；                       B、看书时，先大概浏览课本，通过标号了解本节主要知识点，然后在仔细阅读，会的地
                            方不必细看，难处仔细推敲。C、保存网页时注意图片的保存位置。三、学生回答，教师讲解重点          1、网页中插入图片的格式             A、GIF---最高支持256色，无损压缩，可增加动画效果。B、JPGE---可存取1600万种颜色，采用有损压缩方式，压缩率较大，图片相对教小。C、PNG----支持真彩色，采用无损压缩             D、其它：BMP、PCX、RAS、EPS、PCD、WMF                注意：如果图片不是GIF或JPG格式，那么保存网页时，使用256色或更少颜色的图片
                          会自动被转为GIF格式，其它所有图片转为JPG格式。若插入的是动画，在浏览器下才能看到动态效果。说明：虽然PNG有许多优点，但目前网页中使用最多的仍然是GIF和JPGE两种格式。其它图片
                      最好转换成这两种格式后再插入网页中。那么在网页中到底采用哪一种呢？其实，每一种
                      格式都有它的优点。GIF格式的图片由于只能包含最多256种颜色，所以适合保存那些一
                      文字为主、包含颜色数目教少的图片，而JPGE适合保存颜色数目最大的照片、海报等图
                       片。总之，色彩鲜艳高分辨率的用JPG格式，色彩单调低分辨率的用GIF格式。
      2、网页中添加图片应考虑的问题：                 要想使图片达到最佳效果，并不是一件容易的事，大家往往喜欢在网页上添加很多的图像，造
               成网页页面杂乱，主题不突出。其实网页中的图像不是越多越好。网页中添加图像时首先要考
                虑到以下问题：         A、用图像来达到什么目的？         B、什么样的图片最合适达到这些目的？         C、将插入的图像有多大？           网页中使用的图片不要太大，一般情况最好单张不要超过25-30K，每页图片总量不要超过60K这样站用的磁盘空间较少，网上传输时间较短。网页设计有“30秒40K”的原则，即浏览网页时，30秒内若无法读取40K以上的资料，面对空荡荡的屏幕，浏览者往往想终止读取。D、这些图像放在网页的什么位置最好？        3、改变图像的属性          设置方法：右击图片―选择图片属性，在图片属性对话框中设置 教师演示以下方法：A、改变大小B、设置对齐方式C、给图像加边框D、更换图片4、图片处理A、剪裁图像B、调整对比度/亮度C、、删除图片D、在图片上写文字说明：只有GIF图片可写文字，所以JPGE文件上加文字，计算机先提示是否转变为GIF文件E、图片的定位与图层的形成 [提问] 同学们有没有发现我们选中图片后,出现了什么？[学生回答]又出现了一个工具栏。[总结]对了，我们选中图片后会出现“图片工具栏”。我们以下对图片的处理就是利用“图片工具栏”来实现。[演示]我们选中图片，然后单击工具栏上的“绝对定位”按钮。现在我们会发现，图片已不在一行文字之间，它可以让我们随意移动了。同样，我们还可以利用“图片工具栏”对图片进行图层处理，实现图片的叠放。现在我们插入两个图片，选中第一个图片，然后选择“图片工具栏”上的“上移一层”按钮。这样我们就可以实现两图片的'叠放了。[讲解]我们插入图片后还希望它更美观，同样，我们的“图片工具栏”也提供了这样的效果。我们可以把图片上的任意颜色设置为透明色F、图片的透明处理 [演示]选中图片，单击“图片工具栏”上的“设置透明的颜色”按钮。我们看到指针变成了小魔棒形状，单击我们需要把它变成透明的白色，就产生了透明效果。4、保存网页                保存时对嵌入式图片应Images文件夹中，已防止文件夹中的文件凌乱。
四、学生上机操作，完成任务。巩固练习      利用今天学习的知识制作班级网站的真正主页，取名为“index”开始做那张主页改 名为 “index1”。
课堂小结     本节主要讲了如何向网页中插入图片以及对图片属性的调整。布置作业   无作业
板书设计:                      第5课、网页中加入图片 一、插入图片

A、改变大小B、设置对齐方式C、给图像加边框D、更换图片

二、改变图片属性

三、图片处理

A、裁剪图片
 B、调整对比度、亮度
 C、删除图片
 D、在图片上写字
 E、图片的定位和图层的形成
 F、透明效果处理

四、保存网页:图片保存位置的选择

《插入图片》教案设计

《插入图片》教案设计【教学目标】：知识与技能、掌握在文中插入图片的两种方法方法。2、学会调整图片的方法。3、能够图文并茂地修饰，感受创造的乐趣。过程与方法通过任务驱动......

web中图片的插入设计

背景练习body{background-image:url("pic");background-repeat:no-repeat;background-color:#a8d8ec;background-position:100px 50px;}h2{text-align:center;color:b......

《在文档中插入图片》教案

《在文档中插入图片》教案〔教学目标〕知识与技能目标：通过教学，让学生掌握在word中插入文件图片、改变图片的位置和大小、调整图片的效果、为图片添加边框等基本操作的要领过......

在网页中插入flash的标准代码

使用可实现Flash动画的插入， 但也可以用..标记插入Flash动画，但后者有些复杂，若要和前者一样实现动画的插入，必须要加： data="1.swf"> 才能实现flash动画的插入。我想问下，前者......

在Powerpoint中插入图片文件教学总结

在Powerpoint中插入图片文件教学总结在Powerpoint中插入图片文件教学总结在讲解《在Powerpoint中插入图片文件》时，刚开始我的教学设计只是让学生跟着课本上的例子做，一插入剪......