《在网页中插入图片》教案

合集下载

web中图片的插入设计

web中图片的插入设计

web中图片的插入设计第一篇:web中图片的插入设计body{background-image:url(“pic.jpg”);background-repeat:no-repeat;background-color:#a8d8ec;background-position:100px 50px;}h2{text-align:center;color:blue;font-family:“微软雅黑”;}背景CSS练习第二篇:插入图片教学设计《当个电脑小编辑—插入图片》教学设计天门市渔薪小学王磊【教学目标】(一)知识与能力:1、掌握在文档中插入图片的方法并会编辑图片。

2、了解图片工具的使用方法,理解“文字环绕”的设置。

3、掌握图文混排的方法。

(二)过程与方法:1、采用自主学习、合作探究学习方式来学习知识。

2、小组合作,体验合作的乐趣,感受成功的快乐。

(三)情感态度、价值观:1、激发学生勇于合作交流、勇于实践、勇于创新的思想。

2、培养学生创造美、欣赏美的能力。

【教学重点难点】1、使学生掌握在文档中插入图片的方法2、掌握图文混排的方法【教学时间】 1课时【教学过程】一、情境激趣,引出课题:1、同学们在这节课的开始,王老师带大家去羊羊学校看一看,它们在干什么呢?(文档的对比得出:文字如果配上图片,会显得更加生动、形象。

)2、揭题:我们就一起来学习如何在文档中插入图片(出示课题)二、任务驱动,自主探究1、首先让我们来解决第一个问题:为古诗《黄鹤楼送孟浩然之广陵》插入一张图片。

(学习模块一)2、小组探究汇报,学生演示。

3、教师归纳插入图片的方法:。

插入—>图片—>来自文件—>图片文件—>确定4一张图片插入到文档中了。

你们想试试吗?布置任务(试一试)5、观察插入到古诗中的图片,你发现了什么?6、学生讨论:图片太大,占据了文档的一大块,不美观。

7、是的,我们需要调整图片的大小。

怎样才能改变图片的大小呢?8、师讲解,生操作:首先要在图片上单击选中图片,选中后的图片四周会出现八个小方块,它叫做图片控制点。

第4章在网页中插入图片PPT课件

第4章在网页中插入图片PPT课件

直接5.4插制入插作入图图像像页面
图像可以在Dreamweaver 8中的【设计】视图或者 【代码】视图中被插入到文档里。在Dreamweaver 8的文档中添加图像时,可以设置或者修改图像属 性并可直接在文档窗口中查看所作的修改,插入 图像的具体步骤如下:
➢ (1)用鼠标指针确定图像的插入点。 ➢ (2)单击【插入》图像】菜单项,打开【选择图
GIF格式
GIF全称为“Graphics Interchange Format”, 意为可交换图像格式,它是第一个支持网页的 图像格式,在PC机和苹果机上都能被正确识 别。它最多支持256种颜色,可以使图像变得 容量相当小。GIF图像可以在网页中以透明方 式显示,还可以包含动态信息,即GIF动画。
➢ 5.4.5 插入鼠标经过图像 ➢ 在网页中,鼠标经过图像时经常被用来制作动态
效果。当鼠标移动到图像上时,该图像就变成另 外一个图像。这样的效果被广泛的应用到按钮、 导航条的制作中。具体操作步骤如下: ➢ (1)将光标定位到一个图的位置。 ➢ (2)单击【插入》图像对象》鼠标经过图像】 菜单项,打开【插入鼠标经过菜单】对话框。 ➢ (3)单击【浏览】按钮,分别设置原始图像和 鼠标经过的图像的路径。
PNG格式
PNG全称为“Portable Network Graphics”,意为便携网络图像,它 是逐渐流行的网络图像格式。PNG 格式既融合了GIF能透明显示的特 点,又具有JPEG处理精美图像的 优势,且可以包含图层等信息,常 常用于制作网页效果图。
首页 末页 向上 向下 返回 结束 调音
网页图像来源
首页 末页 向上 向下 返回 结束 调音
JPEG格式
JPEG全称为“Joint Photographic Experts Group”,意为联合图像专家组,它可以高效 地压缩图片,丢失人眼不易察觉的部分图像, 使文件容量在变小的同时基本不失真,通常 用来显示颜色丰富的精美图像。

六年级下信息技术教案在网页中插入图片甘教版

六年级下信息技术教案在网页中插入图片甘教版

第4课在网页中插入图片教课目标:
1、使学生掌握在网页中插入图片、视频
2、使学生懂得设置网页的背景音乐
教课要点:会在网页中插入flash动画、插入背景音乐教课难点:会在网页
中插入视频
教课准备:1、七巧板网页
2、忆江南音乐、“嫦娥一号概略”视频教课过程:
一、导入
师:同学们,你们在阅读网站的时候,看到的网页除了图片和文字之外,还
有没
有看到什么、听到什么呢?
师:同学们说得都很对。

这节课就让我们来学习怎样给网页增添动画与音乐,插入动画、音乐此后,我们创立的网页就更为丰富多彩了。

二、新授
活动一:在网页中增添flash 动画
让学生认识FrontPage中不支持直接插入.swf格式的Flash动画文件,但能够依据以下方法
间接插入。

做一做:给“七巧板”网页增添Flash小游戏。

教师演示操作,学生察看步骤。

学生上机操作,依据书上P19-20页中的步骤,插入小游戏到网页中。

教师巡视指导
活动二:给“七巧板”网页增添背景音乐
同学们已经会给网页增添动画了,假如再配上音乐这个网页就更丰富了。

我们此刻就来学怎么
设置网页的背景音乐,操作步骤与设置网页背景是近似的。

学生上机操作,依据书上P21-22页中的步骤自学。

教师巡视指导
第1 页
活动三:在网页中插入视频
同学们学会了插入动画与背景音乐,此刻再来学怎样给网页插入视频就更简单了。

教师演示操作,解说,学生察看步骤。

生按P23上机操作。

教师巡视指导。

三、试一试:
达成书上第P24页试一试中的题目。

第2 页。

第3课在网页中插入图片

第3课在网页中插入图片
02:11
设置鼠标经过图片 由两张图片组成的:原始图片和转换图片。
组成图片翻转的两张图片必须尺寸相同的,如 果两张图片的尺寸不同,会自动将两张图片的 尺寸调整成同样大小 步骤:插入图片对像鼠标经过图片
练习:创建 变换图片
02:11
02:11
第3课 插入图片
图片的基本格式 插入图片 编辑图片 图片与文字的段落关系
02:11
3.1 插入图片
•了解图片
GIF
JPG
PNG
优点: 优优点点::想想 •是无损压缩••格是支它式无持的们损2图4压有位片缩什的格颜么式色的图片 •支持动画格•缺式支点持优:真缺彩点色?
•支持透明背•是景支有持损透压明缩背格景式的图片,无大碍 缺点:仅支持缺8点位:的较颜低色版本浏览器不支持
02:11
3.2.2插入图片的方法(index) 二种方法
步骤一:[插入]-> [图片]
步骤二:利用插入面点板击常用 点击图片图标
02:11
图片编辑
直接使用鼠标缩放调节图片大小 在属性面板中设置图片大小
注意
恢复图片原始大小,选中 图片单击鼠标右键,选择
Reset Size
02:11
启用Fireworks编辑器
查看->跟踪图片-&要根据链接对象不同而被 人为划分为若干指向不同链接的区域“热点” 的相应图片区域
练习:绘 制热区
02:11
设置背景图片 (1)在文档窗口中,选择菜单栏中的【修 改】|【页面属性】命令,弹出【页面属 性】对话框。 (2) 在【背景图片】文本框中,输入背景 图片文件的地址,或是单击【浏览】按钮, 从弹出的【选择图片源文件】对话框中选 择背景图片文件示。 (3) 单击【确定】按钮,即可在网页中设 置背景图片。

在网页中插入图片

在网页中插入图片

《在网页中插入图片》教案教学目标:知识与技能:1、会打开上次的网页;2、了解图片在网页中的作用;3、学会在网页中插入图片的方法。

过程与方法:通过独立探究和小组探究的方法基本掌握在网页中插入图片。

情感态度与价值观:培养学生的审美能力,形成与同学和谐相处、共同进步的精神。

明白帮助他人的目的就是美化我们的心灵。

教学重难点:重点:了解图片在网页中的作用难点:能在网页中插入图片教学时间:一课时教学过程:一、导入出示往届学生的网页作品(包含有文字、图片)的网页。

同学们请看大屏幕,这个网页里面都有些什么?学生回答:文字、图画等文字部分同学们已经学会了,今天我们就一起来探讨一下在网页中插入图片,我相信我们班的同学一定能做出漂亮的网页。

二、探究新知1、了解图片在网页中的作用出示只有文字和带有图片的两个网页提问:这两个网页哪一个好看呢?(有图片的那一个)为什么?指名同学回答。

(因为第二个网页比第一个多了很多漂亮的图片!)那同学们说说图片在网页中有什么作用呢?(可以使网页更加美观漂亮)2、插入图片,美化(1)打开上次制作的网页请同学们回答老师一个问题:上次我们做的网页怎么打开继续完善它呢?学生回答:启动frontPage网页制作软件——单击文件——打开文件——我的文档,找到主页文件index.htm再打开。

好,请同学们打开上节课我们制作的文字网页,我们将对这个网页插入图片进行美化。

教师巡视,指导(2)介绍寻找图片的方法同学们,在网页中插入图片时,我们需要知道图片的位置,现在,我告诉你们,本课的图片素材存放的位置在:我的电脑\D盘\图片素材文件夹。

你们打开就可以找到自己需要的图片了。

下面,请同学们尝试找出想要的图片。

学生尝试去找,老师巡视指导。

(3)在网页中插入图片。

好,准备工作我们已经完成,下面我们一起来复习一下以前我们在word中插入图片的方法(学生有的可能运用复制——粘贴的方法插入图片,也可能运用菜单插入的方法。

第四课在网页中插入表格与图片

第四课在网页中插入表格与图片

第四课在网页中插入表格与图片一、教学目标分析课堂标准让学生掌握利用表格来布局网页信息的方法。

掌握在网页中插入图形图像。

知识与技能●学会插入表格●学会调整表格●学会插入图片●学会调整图片●学会插入水平线及使用列表。

过程与方法采用任务驱动的方法,自主学习,再通过分组探究,技能竞赛,协作学习,让学生在轻松的氛围下学习,具有使用搜索引擎技巧的能力。

情感态度与价值观1、培养学生协作学习、互相帮助的精神2、培养学生的探索精神和主动学习的习惯。

四、教学重点、难点与解决措施重点:插入与调整表格技巧,插入图片的技巧难点:插入与调整表格的技巧解决措施:让学生通过浏览网页,并下载网上利用表格定位的网页,通过网页制作工具,打开所下载的网页,并将其中的图片删除来达到认识表格的目的,然后利用竞赛的活动,让学生们参与其中,由此来引导学生对网页设计问题的思考,并逐步掌握网页表格布局设计的技巧,也就是掌握网页设计的技巧。

五、教学设计思路:本课以学生为主体,老师为主导的教学模式开展的,以学生的积极探索,小组协作学习、自主学习等学习模式通过反复练习总结,知识水平实现螺旋式上升,最终实现知识的意义建构,并考虑到学生的知识层次有所不同,在拓展学习方面特意设置不同程度的学习内容,满足各层次学生的需要。

六、依据的理论在做中学、引导发现式教学七、教学策略及选用媒体基于教学内容的要求以及学生的特征,本教学设计的教学以学生自主学习为主,老师在课堂中起到主导作用的教学模式开展,通过探究学习寻找解决问题的方法,并以竞赛的形式,让学生在反复的操作中得到搜索的经验,老师引导学生总结经验,把感性认识上升到理发认识。

在拓展知识部分,学生能根据自己的水平选择学习知识的分量,让不同层次的学生都可以在课堂中尽量掌握自己要学的知识,而且以小组的形式开展,有助于同学间互相协作,共同达到知识的意义建构。

使用网络教室平台进行屏幕控制及转播,学生机能接入互联网。

八、教学过程第1课时表格可以很好地起到定位作用,这节课里我们将学习在网页中插入表格与图片。

网页中插入图片教学设计

网页中插入图片教学设计
教具准备
课件、网站相关素材、多媒体课室
教学程序
时间
教学活动
教师活动(内容、策略)
学生活动(内容、形式)
教学意图
一、课堂导入
15分钟
课前复习:
1.复习旧知(插入特殊符号、设置文本格式与编辑文本),导入新课(插入项目符号、插入时间与水平线)
2、展示一些含有图片的精美网页,提出问题如何在网页里插入和编辑图片,美化网页?
听教师讲解
参考书本运用相关知识自主操作探究,完成拓展任务
学生自主练习测试知识的掌握程度
教师小结
在本活动中我们制作了站点的分页,为插入分页中的图像设置大小、边框和文字提示。
学生演示操作思考并理解
知识系列的形成
五、
课堂小结
10分钟
(1)插入图像的几种方法
(2)设置图像属性的方法
学生边听老师的总结边操作相关的知识
教学课题和内容
为网页添加图像
教学日期
3周3
课时数
2
课的类型
综合性
教学目标
⑴掌握使用插入栏插入图像。
⑵掌握使用菜单栏插入图像。
⑶掌握使用Ctrl+Alt+I组合键插入图像。
⑷掌握使用文件面板插入图像。
⑸掌握编辑图像的方法。
教学重点难点
⑴插入图像的各种方法。
⑵图像的编辑操作。
教学方法
讲授法、操作练习法任务驱法
请同学回答和解决问题
学生思考问题,并尝试解决问题
请同学上台演示解决问题
学生遇到问题,讨论解决方法
激情导入
激发学生的学习兴趣
引导学生思考本节课的问题
明确课堂的学习目标
3
20分钟
教师打开网页,边操作演示边讲解以下理论知识:

《在网页中插入图片》教学设计

《在网页中插入图片》教学设计

《在网页中插入图片》教学设计作者:朱琳琳来源:《小学科学·教师版》2011年第11期【设计理念】学习总是与一定的情境相联系的,切合教学内容的情景创设,可以为学生的自主探究提供一个良好的空间,又可以激发学生自主探究的动力。

本课主要采用“任务驱动”教学法来实施教学。

【学情分析】学生已经学会了新建网页,在网页中输入文字。

学生就有“为网页添加图片信息”的欲望,结合因特网知识让学生为自己创建的网页添加图片的信息,添加图片的技能学生已经在word文字处理软件中学习过,因此本节课知识,学生可以自主学习。

【教学目标】1、知识目标在网页中插入图片。

对图片进行编辑。

设置网页背景图片。

2、能力目标:利用插入图片知识,培养学生的图文并茂整体布局网页的综合信息素养能力。

3、情感目标:通过作品展示和评价是让学生体验成功的喜悦,激发学生的创造热情。

【教学重点】在网页中插入图片。

【教学难点】设置网页的背景图片。

【教学方法】情景导入法、任务驱动法【课前准备】FrotntPage2000软件多媒体教学网络系统【教学过程】一、创设情景激发兴趣【教师活动]利用多媒体教学广播系统展示两组图片(“自然美图片”和“灾难图片”)。

两组截然不同的图片,看过后,有什么感受呢?学生:学生欣赏两组图片并谈感受。

教师:同学们都知道,地球是我们的“生命之舟”。

可是我们人类却因为个人的利益,人为的破坏她,导致了各种灾难的发生。

环境污染是我们人类面临的一个严峻问题。

所以同学们我们应该带头保护环境,来宣传爱护环境的重要性。

学生倾听受教育。

教学意图:通过欣赏两组对比图片,宣传环境保护的重要性,对学生进行情感教育,来激发学生学习的兴趣。

二、导入主题欣赏范作教师:同学们想一想,我们可以通过什么途径来宣传爱护环境呢?学生:写作文、画画、制作手抄报、做一个网页……教师:同学们的办法可真多啊!我们可以用这个学期所学的电脑知道来制作网页,宣传“爱护环境”。

教师:回忆:组成网页的两大主要元素是什么?学生:文字和图片。

  1. 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
  2. 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
  3. 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。

教案背景:
《在网页中插入图片》是配合我区信息技术课题《学案引导下信息技术高效互动课堂的构建》开的一堂研讨课。

本课以学案引导为教学手段,引导学生自主学习在网页中插入图片的方法。

本课在调查了解学生现有能力的基础上,充分尊重学生个体差异、以学定教,采用任务驱动、自主探究,同伴互助的学习方式打造有效的课堂教学氛围。

教学课题:
《在网页中插入图片》
教材分析:
网页制作是《小学生学电脑》(凤凰出版传媒集团江苏科学技术出版社)第十一册的内容,是在学生学习了网络基本知识、WORD之后的一个内容。

本课是学生在初步学习FrontPage软件,会制作文字个人主页的基础上,学习用插入图片的方法来美化网页,培养学生的美感和团结互助,共同进步的人文精神。

教学方法:
学案引导,学生自主学习
把WORD软件的相关操作与FRONTPAGE联系起来,通过学生熟悉的WORD学习FRONTPAGE,达到的学习效果还不错。

为了激发学生对网页制作的兴趣,这节课由两张的视觉对比引入,让学生知道我们每个人都可以做出这样精美的网页。

课堂上我们所归纳出的网页中插入图片的方法是来自于学生的探索。

这节课中在学生掌握了一些网页制作的方法后,我占用大量的时间给学生打造了一个自由创作的空间,在我准备的资源中除了有给学生自主学习的学习助手外,还有针对“苏州园林”的素材,每个园林的介绍对应着图片和文字内容,以帮助孩子利用学案和准备好的素材进行自主学习。

《在网页中插入图片》学习助手
班级:姓名:
学习帮助一:
在FRONTPAGE中插入图片的方法和我们以前学过的在WORD中插入图片的方法相似,试试“插入”菜单,看看下面有什么选项。

试一试在“苏州园林”网页中为“拙政园”配上一张合适的图片。

“插入”——“图片”——“来自文件”
学习帮助二:
插入的图片太大,我们应该怎么操作呢?想想在WORD中是怎么操作的。

把“拙政园”的插图调整到合适的大小。

通过缩放来调整图片大小。

学习帮助二:
图片的位置不对,我们在WORD中是怎么操作的,还用这样的方法操作可行吗?请你试一试,为“拙政园”的插图设置居中、左对齐和右对齐的位置,看看哪种方式比较合适。

网页中的图片不能像在WORD中一样通过鼠标拖动和改变环绕方式来调整位置,我们可以通过“左对齐、居中、右对齐”的工具按钮来设置图片的位置。

学习记录表:
(根据你的学习情况,把“√”复制到对应的完成度中)。

相关文档
最新文档