【核心素养目标】第8课《网页的数据呈现》课件+教案+素材-【浙教版2023】《信息科技》八上

中小学教育资源及组卷应用平台 信息技术 第8课 网页的数据呈现 课题 网页的数据呈现 单元 第二单元 学科 信息技术 年级 八年级 教材分析 《网页的数据呈现》该课时教材编排了“网页数据呈现的方式—CSS样式—样式表的基本结构”的系列学习活动，旨在让学生通过体验CSS样式设置的效果，认识CSS样式表，了解样式表的作用;通过网页中添加样式，掌握样式表的基本结构;能理解使用CSS降低网页代码耦合度所带来的便捷。教材编排合理，教学环节注重实践与理论相结合，教材内容贴近学生生活实际，符合八年级学生认知特点。 教学目标 1、信息意识：能够了解CSS（层叠样式表）是用于控制网页布局和样式的重要技术。 2、计算思维：能够将网页设计需求转化为具体的CSS规则，锻炼抽象思维能力。 3、数字化学习与创新：能够了解并使用Bootstrap等CSS框架，提高开发效率。培养创新意识和实践能力。 4、信息社会责任：能够在设计网页时注重环保和节能，减少不必要的资源浪费。 重点 一、网页数据呈现的方式二、CSS样式三、样式表的基本结构 难点 1、样式表的基本结构 教学过程 教学环节 教师活动 学生活动 设计意图 导入新课 通过体验CSS样式设置的效果，认识CSS样式表，了解样式表的作用;通过网页中添加样式，掌握样式表的基本结构;能理解使用CSS降低网页代码耦合度所带来的便捷。探究：1、你浏览过的网页中，看到过哪些网页效果 2、你知道网页中的文字效果是如何实现的 网站为了保证网页风格的整体性，在制作过程中往往要求文本、色彩等样式要协调统一，可以对网页数据各种呈现的效果进行样式的设置。 观看通过老师讲解和学生之间的相互讨论生活中的CSS网页代码的运用场景。 帮助学生理解CSS网页代码的概念，打开课堂。 讲授新课 一 、网页数据呈现的方式HTML定义了网页的内容结构，即网页呈现的文字、图文、视频等内容，用HTML设计网页外观样式时需要使用大量的标记，代码相对多而复杂，使用CSS可以有效地对网页中数据的布局、字体和背景等效果实现更精确的控制，同时可以将网页的结构和格式分离，实现解耦。比如对网站所有页面的风格可以应用一个CSS，只要修改这个CSS文件就可以更新所有页面的风格样式，既提高了更新和维护的效率，同时又缩减了网页的代码，提高了网页的浏览速度。新知拓展你浏览过的网页中，看到过哪些网页效果 二 、CSS样式CSS全称为层叠样式表(CaseadingSlyle Sheels)，也是一种标识语言CSS样式可以方便地设置网页效果，如网页中文字的字号、字体、颜色、位置以及图片的大小等，都涉及网页显示信息的样式。如图8-1。图8-2所示，是添加了样式表的网页效果的前后对比图。图8-2所示的网页是在标签之前添加了以下CSS字体、颜色等样式的代码。亲身体验修改样式表里的属性和属性参数，观察网页外观变化，尝试其他样式的设置。新知拓展你知道网页中的文字效果是如何实现的 CSS文本属性三、样式表的基本结构