点击查阅配套资源:
微课视频 辅助视频 素材下载 查看PPT 电子教材 上机练习 拓展学习
第10讲 :使用CSS+DIV布局二列页面 |
学时:2 |
||
任务目标 |
l 了解多列布局的页面结构模型 l 了解容器层和浮动继承性 l 熟练使用CSS+DIV布局二列页面 |
||
知识内容 |
第3.2节 |
||
重 点 |
使用CSS+DIV布局二列页面 |
||
难 点 |
CSS样式的浮动属性 |
||
教学方法 |
教师:理论与实际操作讲解相结合 学生:预习、课堂学习与课堂练习相结合 师生:教师通过课程引导启发提问、疑难解答、学生练习点评进行互动 |
||
学习方法 |
PPT和知识讲解进行理论学习、播放微课进行案例学习,然后进行案例实操练习、课后习题等练习完成知识学习过程 |
||
资源 |
PPT、电子教材、微课视频、网络课程(http://jx.gdgm.cn/skills/wv/30764673) |
||
教学过程 |
|||
知识点 |
基本内容 |
教学过程 |
建议时长(分钟) |
复习 |
复习上一节课内容 |
运行上一节课案例并强调重点完成复习 |
2 |
知识1:使用模板新建页面 |
1.【案例3-2】 使用模板创建带样式的页面 |
通过PPT结合实际操作详细讲解使用模板创建网页 |
15 |
2.网页结构和样式分析 |
通过PPT结合互联网中网页的结构,通过实际操作详细讲解模板中的CSS样式 |
10 |
|
学生练习 |
解答学生练习过程中出现的问题 |
13 |
|
教师点评案例3-2练习 |
对学生练习中出现的问题进行总结点评 |
5 |
|
知识点2:使用CSS+DIV布局二列页面
|
1、【案例3-3】使用CSS+DIV布局二列页面 |
通过PPT结合实际操作详细讲解二列页面的设计与制作 |
13 |
2.布局层内添加网页元素 |
通过实际操作在页面中添加元素 |
10 |
|
3.页面效果图 |
运行网页并分析讲解 |
2 |
|
学生练习 |
解答学生练习过程中出现的问题 |
15 |
|
教师点评案例3-3练习 |
对学生练习中出现的问题进行总结点评 |
5 |
|
课后作业 |
学生完成课后习题练习 |
布置课后作业 |
|