Web前端技术项目式教程电子教案 任务四 使用CSS及CSS3美化网页.docxVIP

PAGE1

PAGE

任务四使用CSS及CSS3美化网页

课程名称

网页设计

项目名称

使用CSS及CSS3美化网页

任务名称

使用CSS及CSS3美化网页

课时

4

项目性质

□演示性□验证性□设计性√综合性

授课班级

授课日期

授课地点

教学目标

能力目标：

1.使用CSS单位、文本样式、颜色、背景样式等美化页面。

2.使用CSS3边框、阴影、背景、渐变等特性美化页面。

3.使用字体图标美化页面。

知识目标：

1.熟悉CSS文本样式、边框样式、列表样式、背景样式的语法规则。

2.熟悉CSS3边框样式、盒阴影样式、背景样式、渐变样式的语法规则。

3.了解网页中字体图标的插入方法。

素质目标：

1.培养学生的界面设计与审美能力。

2.培养学生遵守行业标准（如W3C规范）的习惯。

教学内容

1.任务描述

2.任务展示与实现

3.教师讲解本任务涉及的知识点

4.任务小结

教学重点

（1）美化首页导航区域样式。

（2）美化首页主体内容区域样式。

(3)美化首页底部区域样式。

教学难点

（1）二级菜单制作

教学准备

1.装有VScode的电脑

2.教学课件PPT

3.教材：《Web前端技术项目化教程》

作业设计

1．设计一个超链接。

教学过程

教学

环节

教学内容与过程

（教学内容、教学方法、组织形式、教学手