《第8课 网页的数据呈现》精品教案

第8课 网页的数据呈现

课 题

教学

目标

重难

点

网页的数据呈现

1. 通过体验CSS设置的效果，认识 样式表，了解样式表的作用。

2. 通过网页中添加样式，掌握样式表的基本结构。

3. 能理解使用 CSS降低网页代码耦合度所带来的便利性。

教学重点：通过网页中添加样式，掌握样式表的基本结构。

教学难点：理解使用CSS降低网页代码耦合度所带来的便利性。

1. 网络教室。

2. 在线应用相关软件或平台。

课时安排

教师活动

一、

话题引入：你知道网页中的文字效果是如何实现的?你

引入

知道网页中的文字效果是如何实现的?

一、网页数据呈现方式

（一）你知道网页数据呈现方式有哪些？

1课时

学生活动 设计意图

通过话题引导，激

参与讨论

发学生学习兴趣，

引出本课课题。

课前准备

说说网页了解网页数据的呈

文本、图像、链接、表格、列表、图表和图形、视

数据的呈现方式

频和音频、动画和交互效果、表单以及其他媒体和插件

现方式

等。

二、CSS样式

二、

新授

（一）你知道什么是CSS？

CSS全称为层叠样式表 (Cascading Style Sheets),

也是一种标识语言，CSS样式可以方便地设置网页效

果。

（二）CSS的样式

字号、字体、颜色、位 置以及图片的大小......

（三）CSS的优点

1、样式与内容分离

了解CSS

1 / 3

了解CSS

2、网页加载速度快

3、一致的样式设计

4、容易维护和更新

5、响应式设计

6、可扩展性

......

（四）教师演示

教师演示添加样式表的网页效果。

活动一：修改样式表里的属性和属性参数，观察网页

外观变化，尝试其他样式的设置。

三、样式表的基本结构

（一）什么是