广东省创新杯说课大赛计算机类一等奖作品：CSS样式表的使用教学设计方案
CSS样式表课程设计
CSS样式表课程设计一、课程目标知识目标：1. 理解CSS的基本概念，掌握CSS的选择器、属性和值的使用方法；2. 学会使用CSS样式表对HTML文档进行美化，包括文本样式、颜色、布局等方面的设置；3. 掌握CSS的盒模型，理解并应用边距、边框、填充和尺寸等属性；4. 了解CSS的继承、优先级和层叠规则，能够解决样式冲突问题。
技能目标：1. 能够编写简单的CSS代码，对HTML页面进行样式设计；2. 能够使用CSS选择器对特定元素进行样式设置，实现对页面元素的精确控制；3. 能够运用CSS盒模型进行页面布局，实现基本的页面排版；4. 能够调试和解决CSS样式表中存在的问题，保证页面显示效果的正确性。
情感态度价值观目标：1. 培养学生对前端开发的兴趣和热情，激发他们主动探索和学习的欲望；2. 培养学生的审美观念，使他们重视网页设计中的美感和用户体验；3. 培养学生良好的团队合作意识，使他们学会与他人共同解决问题，分享经验和成果；4. 培养学生遵守网络道德规范，注重版权和知识产权保护，养成良好的编程习惯。
本课程针对初中年级学生，结合学科特点和教学要求，以实用性和操作性为核心，注重培养学生的实际动手能力和审美能力。
通过本课程的学习，学生将掌握CSS的基本知识和技能，为后续学习前端开发打下坚实基础。
同时，课程中注重情感态度价值观的培养，引导学生形成积极的学习态度和良好的编程习惯。
二、教学内容1. CSS基础概念：介绍CSS的定义、作用和基本语法，让学生理解样式表的概念及其与HTML的关系。
- 选择器：包括通用选择器、类型选择器、类选择器、ID选择器、属性选择器等；- 属性和值：讲解字体、颜色、文本、背景等基本样式属性及其取值。
2. CSS样式设置：学习如何使用CSS对HTML元素进行美化，包括以下内容：- 文本样式：字体、大小、颜色、行间距、文本对齐等；- 颜色和背景：颜色表示方法、背景颜色、背景图片、背景重复等；- 边框和边距：边框样式、边框宽度、边框颜色、内边距、外边距等。
广东省创新杯说课大赛计算机类一等奖作品：单元格的引用说课课件
instructional objectives
过程性评价
形成性评价
instructional objectives
表单主页面 设计表单页面 学生填写页面
Modern teaching means
B/S 收集信息形成性评价
在服务器中设置封闭式的问题，利用网 络快速统计形成性评价，以便在课堂中有 效的进行改进和分层次辅导
instructional objectives
1.运用多媒体投影设备使用提问法
instructional objectives
1.运用多媒体投影设备使用提问法
（$A$1：$D$1）（$A1：$D1） （A1：D1） （A$1：D$1）
明确化的教学目标
学生能够用手画出混合引用—行不变 的运动过程
领会单元格地址引用 掌握地址引用 分析并综合解决地址引用的习题
instructional objectives
（认知层级）
评价
布卢姆
综合 分析 应用 领会 知道
1 2 3
难点
重点
Teaching and learning methods 投 影 设 备 机 房 服 务 器
反 馈 系 统
游戏提问法 运动记忆建构 评价与反馈
Teaching design
instructional objectives 明确化的教学目标 1 2 3 游戏中学生能 100% 的回答出正确的答案 学生能比画出本题中单元格的运动 能完成教师出示的综合性习题 情感态度与价值观 让学生明白正确的结果不是靠猜得到的，而是靠掌握规律，正确思考而得到
信息化设计
单元格地址引用扩展设计
（任务设计
3课时）
广东省“创新杯”数学类说课大赛等奖作品说课教学设计精品模板 (一)
广东省“创新杯”数学类说课大赛等奖作品说课教学设计精品模板 (一)广东省“创新杯”数学类说课大赛等奖作品说课教学设计精品模板一、教学目标本课时目标是让学生通过对图形的观察、比较，巩固矩形、三角形、直线的基本概念；培养学生的数学分析能力和解决实际问题的能力；提高学生的审美素养和美术观察能力，让他们通过数学知识的研究，理解美的复杂性和奥妙。
二、教学内容与课程设计1.教学内容：平面图形的比较判断2.教学过程：(1)通过PPT呈现学习目标，引导学生进入学习状态。
(2)分小组讨论，多角度观察、理解、比较三个图形的不同之处。
(3)通过探究、归纳，让学生自己发现并识别答案。
(4)运用板书和举例子的方法，让学生明白判断规律、提出证明的过程。
(5)运用课堂问答、实践演习的方式，让学生深度掌握知识点。
(6)结合三个图形设计多个例题，让学生独立思考、解答问题。
(7)进一步加深学生对于美学的理解，引导学生探究美学的内在逻辑。
三、教学要点1. 让学生深刻领会图形比较的重要性。
2. 通过探究、思考、实践的方法，培养学生独立思考能力。
3. 加强美学理解，提高学生审美素养。
四、评价与反思1. 通过小组讨论的方式，学生的语言表达能力和合作精神得到锻炼，也丰富了学生的思维。
2. 利用PPT的方式，让学生在视听上得到更好的体验，激发他们的学习热情。
3. 在教学过程中，应注意加强学生的反思性思维能力培养。
4. 在评价中，要注重学生的自我评价和教师评价相结合。
以上是本人个人的教学设计模板，如果还有需要优化或者补充的地方，欢迎大家指正。
作为一名数学教师，我一直坚信教育应该是一个耐心、严谨但又富有创意的过程，希望每一位学子都能在这里收获成长和美好的回忆。
广东省创新杯说课大赛计算机专业类一等奖作品：《模板的应用》教学设计
《网页制作之模板的应用》教案设计
“计算机网络”专业人才培养方案和课程标准
运用Dreamweaver CS5软件制作页面，对页面进行图文的输入和编辑。
学生思维活跃，活泼好动，喜欢交流，动手能力和模仿能力较强。
学生自立、说出创建模板的方法，能将已有网页生成模板。
课标理论的要求
参考资料：《Dreamweaver CS4 网页设计与制作技能案例教程》印刷工业出版社
任务一：“商务网页”模板制作。
解决学生能力参差不齐的问题，通过增加创造型思维的训练、设计和逐步制作自己的网站等手段，使有能力的学生进一步发挥自己的技能，进行深度创作和设计；通过巡视、指导，组内互助，使能力稍差的学生，按教师的要求完成基本技能的操作，暂缓创造等手段，使能力弱的学生减少挫败感。
4. 【知识延伸】已有网页的模板创建
【演示重点知识】 修改模板
更新模板
为学有余力的学生所做的调整: 思得。
最新全国创新杯计算机说课大赛一等奖课件网页换装----用CSS改变网页外观
说教材
【学情分析】： 中专二年级，计算机应用专业学生，班级人数 35人。 通过前面的学习学生已经掌握了使用 Dreamweaver软件设计网页的基础操作，能够比较 熟练的进行简单的网页设计。但是中专学生在学习 过程中相对来说主动思考能力不强，学习的条理性， 总结归纳能力有待提高。
说
课：宋
说
课：宋
妍
说教材
【学习任务】：
1、什么是CSS 学习目标: 2、认识CSS面板
3、创建及应用CSS类样式
学习重点： 创建及应用CSS类样式
学习难点：
CSS类样式应用
关 键 点：
创建及应用CSS类样式
说
课：宋
妍
说教法
【教学方法】： 讲授法、演示法、启发法、课堂讨论法、练习法。 【教具准备】： 多媒体网络机房
不足之处：
个别学生学习主动性有待进一步调动。
有待改进： 和监督制度，注意结合学生层次和性格分组。
再上类似的实训课时，应注重完善课 课：宋 妍
妍
说教材
【教学目标】：
知识与技能: 掌握创建及应用CSS类样式的操作方法。 本着“以能力为本位”的指导思想， 培养学生正确的分析、处理和解决实际问 题的能力以及协作能力。 以职业教育“五个对接”为指导，培 养学生学习能力、创新能力、团队精神， 使学生富有责任感，能够终身学习。
过程与方法:
情感、态度 与价值观：
【授课时间】：
一课时
说
课：宋
妍
说学法指导
说
课：宋
妍
说教学过程
激趣 导入 讲授 新课 课堂 练习 小结 作业 课堂 答疑
说
课：宋
妍
说教学过程
广东省创新杯说课大赛计算机类一等奖作品：CSS样式表的使用教学设计方案
教学设计一、【课时】：2课时二、【教材分析】：1、知识内容分析：本课程内容选自高等教育出版社教材网页设计与制作(HTML+CSS+JavaScript)第4单元《CSS的应用》任务一CSS的引用、任务二页面样式设置，设计课时为2个课时。
本章在整个课程体系里起到承上启下的作用，它既是对前面的基础章节的综合深化，又开启了后续DIV+CSS知识对接。
在本课之前，学生基本掌握网页制作的主要知识点，有一定的代码基础。
而本课内容CSS样式表的使用是学生进行网页设计的基础和提高。
学生通过理解CSS样式的概念，掌握用导入外部CSS样式表、修改CSS选择器属性的方法来设计和美化网页，并能对所设计的作品进行评价，培养学生的设计、审美能力及职业素养和创新精神。
本次教学活动对学生的网页制作与设计起着基础性作用。
2、我对教材的处理方法：①把教材所涉及的知识点进行分层，使学生由简入深理解和掌握CSS样式表的使用。
②由CSS样式表的使用引导学生对网页界面设计的分析。
三、【学生分析】：教学对象为我校计算机应用专业中职二年级（上学期）学生。
学生学习网页制作已有一个学期，对这节课之前的学生情况分析如下：1、学生知识能力分析：①学生能熟练使用Dreamweaver软件②对于静态页面的设计有一定的基础。
③学生有简单的代码基础。
④在以往的学习过程中有简单接触过嵌入式的CSS样式⑤学生缺乏动手能力。
⑥对作品的评价缺乏系统的认识和理解。
⑦学生技能水平出现分化现象。
2、学生自学能力分析：我在课堂教学过程中，注重在学生认知水平能够承受的前提下安排一些适合自学的内容让学生自己掌握，从中培养学生的自学能力。
开始自学的内容要少而简单，等学生认为自学不是一件很难的事情且乐于参与时，再适当加大自学的难度。
在教学过程中，长期渗透自学理念，学生们已经有了较强的自学能力。
因此，尽管本课是一节综合项目设计课程，我还是在教学方法中渗透自主探究学习法，相信学生有能力获得成功。
广东省创新杯说课大赛计算机专业类一等奖作品：《模板的应用》教学课件
任课教师：陈春艳
任务3更新和管理模板
模板更新网页 方法1：自动更新修改模板
将修改后的模板保存，弹出“更新模板文件”对话框，系 统将自动的对列表中的文件进行更新
Dreamweaver CS5网页制作项目实践
任课教师：陈春艳
注意事项
TIPS
DW对中文的支持不佳， 在命名文件时候尽量使 用英文字母。 模板是特殊文档，扩展 名是.dwt，不是html 模板制作后，无法直接 预览
Dreamweaver CS5网页制作项目实践
8
任课教师：陈春艳
任务1创建模板
步骤1：站点的设置 步骤2：制作模板（编辑统一风格区域：不可 编辑区）
任课教师：陈春艳
任务1创建模板
步骤3：插入模板可编辑区 （用于显示不同内容的编辑 区域）
方法1：选择“ 插入”>“ 模 板对象”>“ 可编辑区域” 方法2：右键单击，然后选 择“ 模板”>“ 新建可编辑 区域”
Dreamweaver CS5网页制作项目实践
任课教师：陈春艳
任务1创建模板——概念
LOGO
Dreamweaver CS5 网页制作项目实践
项目十 模板的应用 任课教师：陈春艳
项目十 模板的应用
1 2 3 4 5 6
项目分析 项目分解（子任务） 任务目标 任务实现 任务扩展 项目小结
Dreamweaver CS5网页制作项目实践
2
任课教师：陈春艳
Байду номын сангаас
项目导入
网站欣赏
思考问题： 这些网站有什么统一 的特点呢？
当前已设计好的网页保存为模板文件。
Dreamweaver CS5网页制作项目实践
创新杯说课大赛计算机应用基础类一等奖作品：电子表格处理软件应用教学设计方案(正文)
【教学内容】健康梦·中国梦——健康体检中的数据处理：制作数据图表【授课班级】13级护理2班（护理专业一年级学生）【学生人数】49人【授课形式】理论实践相结合【授课时间】2课时（90分钟）【教材】中等职业教育课程改革国家规划新教材《计算机应用基础（Window XP+Office 2003）》（第2版）（总主编：黄国兴周南岳主编：周南岳高等教育出版社出版）【教材分析】本节课内容选自高等教育出版社《计算机应用基础（Window XP+Office 2003）》（第2版）教材。
该书涵盖了计算机基础知识、Window XP操作系统、因特尔（Internet）应用、文字处理软件应用、电子表格处理软件应用、演示文稿软件应用等计算机基础知识，制作数据图表是课本第5章电子表格处理软件应用中第五节的内容。
重点介绍了Office 2003办公软件之一Microsoft Office Excel 2003的基本知识与基本操作，是本章需要掌握的重点内容之一。
学好数据表格制作既是学好本书的重点，也是为职业生涯奠定基础。
因此，掌握制作数据图表的知识与操作至关重要。
【学情分析】本节课的授课对象是中等职业卫生学校一年级护理专业学生，该班学生学习医学专业知识兴趣浓烈，经过一年级第一学期的学习能够掌握诸如《解剖学》、《病理学》《生理学》《护理学基础》等医学基础课程，可以依据疾病常见症状与临床表现采用相应护理措施，具备一定的护理操作技能。
但是，她们对计算机应用基础这一课程不够重视，更多的是对医学专业课程感兴趣。
因此，课程设计着重突出计算机与医学的结合，联系现代信息化医院护士工作站的工作环境和操作要求，让学生认识到计算机与医学的密切联系，从而重视计算机应用基础这一课程，调动他们的学习兴趣与积极性。
同时，中职学生具有较强的好奇心、思维敏捷、灵活、大胆想象、富有创造力和激情、敢于实践，对多媒体一体化教学、主题活动、操作技能很感兴趣。
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
《网页换装秀》
——CSS样式表的使用
教
学
设
计
一、【课时】：2课时
二、【教材分析】：
1、知识内容分析：
本课程内容选自高等教育出版社教材网页设计与制作(HTML+CSS+JavaScript)第4单元《CSS的应用》任务一CSS的引用、任务二页面样式设置，设计课时为2个课时。
本章在整个课程体系里起到承上启下的作用，它既是对前面的基础章节的综合深化，又开启了后续DIV+CSS知识对接。
在本课之前，学生基本掌握网页制作的主要知识点，有一定的代码基础。
而本课内容CSS样式表的使用是学生进行网页设计的基础和提高。
学生通过理解CSS样式的概念，掌握用导入外部CSS样式表、修改CSS选择器属性的方法来设计和美化网页，并能对所设计的作品进行评价，培养学生的设计、审美能力及职业素养和创新精神。
本次教学活动对学生的网页制作与设计起着基础性作用。
2、我对教材的处理方法：
①把教材所涉及的知识点进行分层，使学生由简入深理解和掌握CSS样式表的使用。
②由CSS样式表的使用引导学生对网页界面设计的分析。
三、【学生分析】：
教学对象为我校计算机应用专业中职二年级（上学期）学生。
学生学习网页制作已有一个学期，对这节课之前的学生情况分析如下：
1、学生知识能力分析：
①学生能熟练使用Dreamweaver软件
②对于静态页面的设计有一定的基础。
③学生有简单的代码基础。
④在以往的学习过程中有简单接触过嵌入式的CSS样式
⑤学生缺乏动手能力。
⑥对作品的评价缺乏系统的认识和理解。
⑦学生技能水平出现分化现象。
2、学生自学能力分析：
我在课堂教学过程中，注重在学生认知水平能够承受的前提下安排一些适合自学的内容让学生自己掌握，从中培养学生的自学能力。
开始自学的内容要少而简单，等学生认为自学不是一件很难的事情且乐于参与时，再适当加大自学的难度。
在教学过程中，长期渗透自学理念，学生们已经有了较强的自学能力。
因此，尽管本课是一节综合项目设计课程，我还是在教学方法中渗透自主探究学习法，相信学生有能力获得成功。
3、学生个性特点分析：
可以通过4个词语来高度概括：“乐于探索”、“喜欢挑战”、“个性鲜明”、但却“缺乏毅力”。
四、【教学目标】：
1、知识与技能：
理解CSS样式表的概念、内外部样式表的应用；
修改CSS选择器属性值。
2、过程与方法：
使用蓝墨云班课移动教学、交互式课件、三维动画学习资源、微课视频辅助教学，通过小组合作探究、自主学习等实现教学目标。
3、情感目标
在辅导学生完成任务的过程中，激发学生的审美情操，创设与实际岗位相结合的情境，培养学生的职业素养。
五、【教学重点及难点】：
1、教学重点：
理解CSS样式表的概念、添加外部样式表的应用；
修改CSS选择器属性值。
2、教学难点：
修改CSS选择器属性值
六、【教法与学法】：
1、教学思想：
当前职业中学计算机专业教学的主流取向是以建构主义的教学思想与学习理论为指导去组织和实施各项教学活动。
在探索基于建构主义理论的教学模式的过程中，本次教学活动采用信息化教学设计理念，利用信息技术创设情景、开发教学资源动态网站，以学生为中心，学生在老师精心创设的情境、自主探究空间、交流与协作活动、自我评价体系等学习环境中充分发挥自身的主动性和积极性，对所学的知识进行意义建构，并用其所学解决实际问题。
2、教学策略：
①课堂融入信息化手段微课视频、三维动画、交互式课件，依托蓝墨云班课移动学习平台为载体，引导学生积极主动参与到教学活动中，激发学生学习的兴趣和求知欲。
②通过采用任务驱动、小组合作学习的教学方法，引导学生在共同完成作品的模仿和创作过程中，培养“互帮互学、宽容待人、荣辱与共”的合作精神。
③通过采用自主探究学习的教学方法，引导学生充分利用教学资源网站完成自己的任务，从而增强学生自主探究学习的精神和解决问题的能力。
④通过学生对作品的相互评价，培养他们客观、辩证地判别事物的能力，又有利于老师掌握教学信息的反馈，及时调整和改进教学方法。
⑤我将混合教学模式运用于此次课程教学中，很好地衔接了“课堂—课下—课后”。
让学生充分利用课下的时间来巩固技能，提高创作能力；该模式的开展充分调动了学生的积极性、主动性和创造性。
逐步让学生从被动学习，转变成主动学习。
七、【教学媒体】：
交互式课件、三维动画、微课视频、班级学习网、音乐、极域教室系统、多媒体网络教学平台、计算机
八、【教学流程】：
整个教学过程实施，主要分三部分：
课前准备、课堂教学、课后拓展。
第一部分：【课前准备】
1、教师准备：
①制作准备本课主要知识点，提前把本课学习资源发放到蓝墨云班课学习平台上。
②在蓝墨云班课学习平台上先发布学习问题供学生预习思考，并收集学生在网上提交的问题回答，充分
了解学生对本节课的预习情况。
③制作准备《CSS样式表的使用》交互式课件。
④制作准备《CSS样式的使用》系列微课视频——《外部CSS样式表的导入》、《CSS选择器属性值的修改》
等。
⑤制作准备《美美的换装秀》、《美美的搭配秀》系列的三维动画。
⑥制定学生课堂表现评价量规表以及设计作品的评价量规表。
⑦在平常的教学过程中，就有意识地根据水平差异让学生结成学习伙伴，形成了相对固定的合作小组。
2、学生准备：
①自主预习《CSS样式表的使用》交互式课件。
②课前按要求尝试解释什么是CSS样式表，并思考教师在蓝墨云班课学习平台上发布的学习思考问题。
③全体学生按“异质分组”的方法进行分组，为小组协作学习做好准备。
本次课将学生分为6个小组，每小组7人左右，每组1名组长。
第二部分：【课堂教学】
教师一边操作一边讲解如何在页面中导入CSS外部样式表。
（2）播放“导入外部CSS样式表”微课
教师演示完毕，播放导入外部CSS样式表相关知识点的微课视频，帮助学生更好地记住操作步骤。
（3）学生小试牛刀，微课相辅
任务要求：
下载素材，在原始的网页界面导入外部CSS样式表，观察网页界面的变化。
对比导入不同的CSS样式表，页面的变化如何？
3、任务三：化身“服装设计师”——修改CSS选择器属性值
学生在任务二学会了导入外部CSS样式表。
（1）结合任务二，提出问题，知识点难度增大
问题：同学们在导入外部CSS样式表后，对于网页上一些不满意的局部，该怎么去修改？是否导入外部CSS样式表后就不能改动？如何提高灵活度？
（2）引入CSS选择器属性值概念，三维动画视频帮助理解
教师播放三维动画视频，该视频还是把网页类比成小姑娘，这次的视频不同于前面视频的是小姑娘的服装不是固定的套装，而是上衣、裙子、裤子、鞋子等可以自由地讲解操作步骤
认真观看微课，熟记几个重要的操作步骤
下载素材，观察还没导入
式表之前的网页界面；借助微课视频，
观察导入
的页面变化。
仔
CSS
面，发现与界面格
方，并思考用什么方法改进。
观看《美美的搭配秀》
设计，思考两者的类比关系
第三部分：【课后拓展】
九、【教学附件】：
附件１：网页设计效果图的评价量规表（小组互评）
2016年广东省中等职业学校“创新杯”教师信息化教学设计和说课大赛
附件2：学生课堂表现评价量规表（自我评价）
11 / 11。