1、城南高级中学网络技术应用教案备课人 编号 备课日期课题 5.2.1 用 CSS 美化网页 上课日期知识与能力（1）理解什么是 CSS 样式表； （2）掌握运用 CSS 进行样式设置的方法和格式； （3）掌握在 HTML 中加入 CSS 的三种方法。过程与方法培养学生独立思考、动手实践的能力；培养学生自主探究性、协作性学习能力；激发学生学习信息技术的兴趣，培养学生发现美、创造美的能力，提高学生的综合素质。教学三维目标情感态度价值观 通过学习运用 CSS 样式表优化网页制作，让学生学习正确、合理运用技术，了解技术服务于内容的原则教材分析教材“CSS 样式表”这一节是在学生了解了客户端脚本语言的基础
2、上的学习，要求学生了解 CSS 基本知识、掌握运用 CSS 进行样式设置的方法和格式。本部分是本章的重点内容。 教学重点 在 HTML 中加入 CSS 的三种方法教学难点 CSS 样式设置的方法和格式教学方法 讲授法、小组讨论法、问题激励法教学媒体 多媒体微机教室、网络广播软件教学过程一、导入展示 CSS 实例 代码：设计在线 提示学生观察上面代码。二、教学过程今天我们来学习 CSS 样式表，这是制作动态网页的另一核心技术。 城南高级中学网络技术应用教案那么，什么是 CCS 样式表呢？使用 CSS 的优点有哪些？请同学们学习教材第 112 113 页内容。 然后小组汇报。 展示以下例子：如果我
3、们想做出上面这样一个文字样式，那么可以用如下的 HTML 样式来实现。 欢迎进入机器人做学玩网站 ! 讲解 CSS 的实现。 分析 CSS 与 HTML 代码的不同。 讲解使用 CSS 的注意事项：有的比较老的浏览器不支持样式表语法，不会将 和 之间的文本显示出来，若要避免这种情况的发生，就要加入 代码。 学生观察文字样式 在教师指导下 用 CSS 样式表来对 HTML 文档进行编辑，在 标签前加入下面 CSS 代码， 学生实践：1用 FrontPage 打开“机器人做学玩”网站的首页，观察在这张网页上，是否利用 CSS 进行了样式设置，如果城南高级中学网络技术应用教案作业布置 每组完成课后实
4、践部分并进行组内自评和小组互评。教学反思：有，请仔细观察它的语句。 2请大家在自己做的网站上，编写一到两个 CSS 文字样式，来替换原有的 HTML 文字样式，并观察其效果。演示 在 HTML 中加入 CSS 的三种方法 1嵌入式样式表 2内联式样式表 3外联式样式表 给出部分 CSS 代码，由学生用不同方法实现其效果。 学生自主实践探究在 HTML 中加入 CSS 的三种方法。 1试着用 CSS 来改变“机器人做学玩”网站中浏览器默认的超链接样式，可以用任意一种加入 HTML 的 CSS 方式。 2要求样式：当鼠标划过时，设为超链接的文字，变成淡蓝色，字体由 9pt 变成 10pt，并出现下划线。 代码：教师评价学生 CSS 样式表应用效果城南高级中学网络技术应用教案
