8.定义CSS样式 教案-2023新冀教版八年级全册《信息技术》.doc

上传人(卖家):QXX 文档编号:7027378 上传时间:2023-08-29 格式:DOC 页数:5 大小:45.50KB
下载 相关 举报
8.定义CSS样式 教案-2023新冀教版八年级全册《信息技术》.doc_第1页
第1页 / 共5页
8.定义CSS样式 教案-2023新冀教版八年级全册《信息技术》.doc_第2页
第2页 / 共5页
8.定义CSS样式 教案-2023新冀教版八年级全册《信息技术》.doc_第3页
第3页 / 共5页
8.定义CSS样式 教案-2023新冀教版八年级全册《信息技术》.doc_第4页
第4页 / 共5页
8.定义CSS样式 教案-2023新冀教版八年级全册《信息技术》.doc_第5页
第5页 / 共5页
亲,该文档总共5页,全部预览完了,如果喜欢就下载吧!
资源描述

1、第二单元第8课 定义CSS样式第二单元第8课定义CSS样式 一、概述定义CSS样式是河北教育出版社出版的信息技术第八课的内容。CSS样式表涉及到语言代码,让学生能够理解并会运用CSS标签来美化网页,然后通过演示操作过程,让学生体验如何用CSS标签来美化标题。通过学习运用CSS样式表优化网页制作,让学生学习正确、合理运用技术,了解技术服务于内容的原则。二、教学目标分析1知识和技能目标 (1)理解什么是CSS样式表; (2)掌握运用CSS进行样式设置的方法2过程和方法目标 通过学习运用CSS样式表优化网页制作,让学生学习正确、合理运用技术,了解技术服务于内容的原则。 3情感态度和价值目标 培养学生

2、独立思考、动手实践的能力;培养学生自主探究性、协作性学习能力;激发学生学习信息技术的兴趣。 教学重点:CSS 样式设置的方法。教学难点:运用CSS标签美化网页三、学习者特征分析CSS样式表涉及到语言代码,作为初中七年级学生来讲,HTML语言实在很难以理解,我们又没有太多的时间去学习这些语言。很多学生在学习的过程中会产生畏难心理。那么怎么让学生能够理解并会运用CSS标签来美化网页呢?我设计了一个任务:用CSS标签来美化标题。通过讲解让学生理解标签h2可以代表标题。然后通过演示操作过程,让学生体验如何用CSS标签来美化标题。其后,学生可以通过参看操作步骤提示的方法,来亲自尝试用CSS标签美化标题的

3、过程。通过这样的处理,将学生难以理解接受的HTML语言简化。四、教学策略选择与设计遵循“用任务驱动”的思路,努力将理论与实践相结合,让学生自主探究,提高学习技能的兴趣。根据学生的实际情况,创造性、实用性和新颖性的原则安排教学实例。五、教学资源与工具设计1、一台教师演示用计算机2、学生多媒体计算机网络3、教学软件以“教师主导、学生主体”为指导思想,采用学生自主学习、合作学习的方式。以“任务驱动”与“问题解决”为主线,采取讲解法,演示法,练习法完成教学任务,从解决问题出发,是一个师生交流、学生亲历亲为、相互合作、感受创作成功成就感的过程。六、教学过程引入新课,认识CSS。教师活动:导入:这节课我们

4、学习课本的第八课定义CSS样式。那么什么是CSS呢?CSS中文翻译成“层叠样式表”,是一种制作网页的新技术。成为网页设计必不可少的工具之一,在当今的网页制作中,几乎所有漂亮的网页都用了CSS。借助于CSS的强大功能,网页将在你丰富的想像力下千变万化。这节课我们就来初步领略CSS打造精彩的页面效果。学生活动:学生激发了学习的兴趣,产生学习的欲望。明确目标,自主探索。教师活动:一、用CSS轻松美化文字我们知道,在网页中字体的好看与否是直接关系到页面的整体效果,因此对文字的控制就显得很重要。下面我们可以用CSS轻松美化文字打开网页文件tuijian1.htm。 学生活动:学生观察,并学习操作方法。教

5、师活动:1.教师演示操作:创建CSS样式方法1:“文本CSS样式新建”,打开“新建CSS规则”对话框方法2:“窗口CSS样式”,打开CSS面板,单击“全部”标签,单击“新建CSS规则”按钮,打开“新建CSS规则”对话框2、教师讲解对话框的选项含义【类】是一种新的样式表示符,可以任意命名。它是将CSS样式应用于选定的区域,若要在整个页面的相关区域应用CSS样式,则需选择【标签】和【高级】方式。【标签】是将页面源文件中的html标记重定义。用标签定义的CSS样式设置完毕后,该CSS样式马上生效。【高级】一般用于超链接的美化。在该对话框的下方选区里,可以选择CSS样式表的引用方式。那么这两个选项有什

6、么区别呢?选择【新建样式表文件】表示对CSS样式表的引用是外部文件方式,我们选择【仅对该文档】。在该对话框上有8种分类,其中,【类型】分类是对文字属性的设置。【背景】分类是对背景属性的设置。此处,我们选择类,仅对该文档,起名为textcss。3、应用CSS选中文本,在属性面板的样式框中选择刚定义的样式。4、学生自学并探索CSS的规则定义完成任务一。任务二选做学生活动:学生学习理解各种选项的功能,学生自学并自主探究,动手操作体会并掌握操作方法,能对文本段落排版。学生尝试操作。5、编辑CSS样式方法:双击CSS面板的新建的样式textcss,打开CSS规则定义6、CSS实现图文混排效果我们之前在网

7、页中插入图片的时候,是利用了表格来实现定位的。其实,我们完全也可以利用CSS来轻松实现图文混排效果。那么怎么实现的呢?实际上是用了方框属性。浮动右对齐;边界-左2字体高。这个设置的含义是:定义图片的左边距为2em,图片浮动在文字的右边。单击应用。7、用CSS标签美化标题下面,我们学习用CSS标签美化标题教师讲解:标签的含义:Tuijian1.htm中光标定位在标题,在标签位置可以看到有一个标签(h2),选中(h2),则整个标题都选中。也就是标签h2代表了整个标题。当我们对标签h2做CSS设置的时候,标题就会应用此样式。此时,我们选择新建样式表文件,就会将此CSS保存成一个文件,以便在其它网页中

8、应用。一、完善内容页面,展示要完成的任务。1.插入一条水平线(1)定位光标(2)“插入HTML水平线”(3)利用属性面板设置,美化水平线2、插入文章更新的日期(1)定位光标(2)“插入日期”,选中“储存时自动更新”复选框,每次保存时页面时间会自动更新。学生活动:学生尝试操作,生尝试插入图片,并利用CSS的方框,实现图文混排,继续探究并完成标题文字的美化,生自学并操作。实践探究,反馈巩固:提出问题:在美文推荐的文章页面中,都有一条水平线,那么我们能不能利用CSS样式的选择器类型中标签中的hr来统一美化各页面的水平线呢?学生活动:学生自学并操作。小组长,评定小组成员作业完成情况。七、教学评价设计创

9、建量规,向学生展示他们将被如何评价(来自教师和小组其他成员的评价)。另外,可以创建一个自我评价表,这样学生可以用它对自己的学习进行评价。八、帮助和总结CSS样式表涉及到语言代码,作为初中七年级学生来讲,HTML语言实在很难以理解,我们又没有太多的时间去学习这些语言。很多学生在学习的过程中会产生畏难心理。那么怎么让学生能够理解并会运用CSS标签来美化网页呢?我设计了一个任务:用CSS标签来美化标题。通过讲解让学生理解标签h2可以代表标题。然后通过演示操作过程,让学生体验如何用CSS标签来美化标题。其后,学生可以通过参看操作步骤提示的方法,来亲自尝试用CSS标签美化标题的过程。通过这样的处理,将学生难以理解接受的HTML语言简化。考虑到学生的学习差异,学生可以通过使用教师提供的操作步骤向导学习,使每位学生都能很好的完成学习任务,提高了课堂教学效率,取得较好的教学效果。5

展开阅读全文
相关资源
猜你喜欢
相关搜索
资源标签

当前位置:首页 > 初中 > 信息 > 冀教版(2017) > 初中二年级
版权提示 | 免责声明

1,本文(8.定义CSS样式 教案-2023新冀教版八年级全册《信息技术》.doc)为本站会员(QXX)主动上传,163文库仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。
2,用户下载本文档,所消耗的文币(积分)将全额增加到上传者的账号。
3, 若此文所含内容侵犯了您的版权或隐私,请立即通知163文库(发送邮件至3464097650@qq.com或直接QQ联系客服),我们立即给予删除!


侵权处理QQ:3464097650--上传资料QQ:3464097650

【声明】本站为“文档C2C交易模式”,即用户上传的文档直接卖给(下载)用户,本站只是网络空间服务平台,本站所有原创文档下载所得归上传人所有,如您发现上传作品侵犯了您的版权,请立刻联系我们并提供证据,我们将在3个工作日内予以改正。


163文库-Www.163Wenku.Com |网站地图|