《浙教版信息科技八上第8课 网页的数据呈现 课件》由会员分享，可在线阅读，更多相关《浙教版信息科技八上第8课 网页的数据呈现 课件（17页珍藏版）》请在金锄头文库上搜索。
1、信息科技八年级上网页的数据呈现网页的数据呈现通过体验CSS样式设置的效果，认识CSS样式表，了解样式表的作用；通过网页中添加样式，掌握样式表的基本结构；能理解使用CSS降低网页代码耦合度所带来的便捷。学习目标1、你浏览过的网页中，看到过哪些网页效果?2、你知道网页中的文字效果是如何实现的?本课探究1网页数据呈现的方式5网页数据呈现的方式你知道网页数据呈现方式有哪些？文本、图像、链接、表格、文本、图像、链接、表格、文本、图像、链接、表格、文本、图像、链接、表格、列表、图表和图形、视频和音列表、图表和图形、视频和音列表、图表和图形、视频和音列表、图表和图形、视频和音频、动画和交互效果、表单以频、动
2、画和交互效果、表单以频、动画和交互效果、表单以频、动画和交互效果、表单以及其他媒体和插件等。及其他媒体和插件等。及其他媒体和插件等。及其他媒体和插件等。2CSS样式7 CSS样式你知道什么是CSS？CSSCSSCSSCSS全称为层叠样式表全称为层叠样式表全称为层叠样式表全称为层叠样式表 (CascadingStyleSheets),(CascadingStyleSheets),(CascadingStyleSheets),(CascadingStyleSheets),也也也也是一种标识语言，是一种标识语言，是一种标识语言，是一种标识语言，CSSCSSCSSCSS样式可以样式可以样式可以样式可以
3、方便地设置网页效果。方便地设置网页效果。方便地设置网页效果。方便地设置网页效果。8 CSS样式CSS的样式：字号、字体、颜色、位字号、字体、颜色、位字号、字体、颜色、位字号、字体、颜色、位置以及图片的大小置以及图片的大小置以及图片的大小置以及图片的大小.9 CSS样式CSS的优点：1 1 1 1、样式与内容分离样式与内容分离样式与内容分离样式与内容分离2 2 2 2、网页加载速度快网页加载速度快网页加载速度快网页加载速度快3 3 3 3、一致的样式设计一致的样式设计一致的样式设计一致的样式设计4 4 4 4、容易维护和更新容易维护和更新容易维护和更新容易维护和更新5 5 5 5、响应式设计响应
4、式设计响应式设计响应式设计6 6 6 6、可扩展性可扩展性可扩展性可扩展性.10CSS样式教师演示添加样式表的网页效果。11CSS样式活动一：修改样式表里的属性和属性参数，观察网页外观变化，尝试其他样式的设置。3样式表的基本结构13样式表的基本结构什么是标签？标签是标签是标签是标签是HTMLHTMLHTMLHTML中用于定义内部样中用于定义内部样中用于定义内部样中用于定义内部样式表的标签。它位于式表的标签。它位于式表的标签。它位于式表的标签。它位于标签内部，用于标签内部，用于标签内部，用于标签内部，用于在网页中直接指定元素的样式。在网页中直接指定元素的样式。在网页中直接指定元素的样式。在网页中直接指定元素的样式。14样式表的基本结构标签的基本语法：15样式表的基本结构实例展示：16样式表的基本结构活动二：用CSS样式表美化网页。谢谢大家谢谢大家
