基本信息
文件名称:《微信小程序开发案例教程》教案 第4课 微信小程序的视图(二).pdf
文件大小:1.78 MB
总页数:5 页
更新时间:2025-06-02
总字数:约1.01万字
文档摘要

课题微信小程序的视图(二)

课时2课时(90min)

知识技能目标:

(1)了解WXSS文件的基础知识

(2)熟悉选择器、盒模型及flex布局的相关知识

教学目标

(3)了解尺寸单位、样式导入及内联样式的相关知识

素质目标:

?培养实践能力,在实践中学习,在学习中实践

教学重点:WXSS支持的选择器、盒模型及flex布局

教学重难点

教学难点:能够使用WXSS文件设置微信小程序的页面样式

教学方案例分析法、问答法、讨论法、讲授法

教学用具电脑、投影仪、多媒体课件、教材

第1节课:课前任务→考勤(2min)→问题导入(5min)→传授新知(38min)

教学设计

第2节课:问题导入(5min)→任务实施(35min)→课堂小结(3min)→作业布置(2min)

教学过程主要教学内容及步骤设计意图

第一节课

【教师】布置课前任务,和学生负责人取得联系,让其提醒同学通过APP或

其他学习软件完成课前任务通过课前任务,使

请大家分别从WXSS,学习选择器、尺寸单位、盒模型、flex布局,以及学生了解所学课程

课前任务

样式导入、内联样式的相关知识点进行初步的了解。的重要性,增加学生

的学习兴趣

【学生】完成课前任务

【教师】使用APP进行签到培养学生的组织

考勤

纪律性,掌握学生的

(2min)【学生】班干部报请假人员及原因

出勤情况

【教师】创设情景,并组织学生讨论下列问题:

对于以前搞客户端开发的来说,有着客户端的逻辑,就是不知道怎么设

置样式,把对应的控件显?出来。界?结构wxmL?较容易理解,主要是由

??类基础组件构成、app.wxss是全局样式,作?于每?个页?,?page

下的每?个的wxss?件只作?于当前页?,并对全局样式中的相同属性会覆通过问题导入的

问题导入盖。方法,引导学生主动

(5min)(1)构成wxmL的??类基础组件是什么?思考,激发学生的学

习兴趣

(2)对于微信?程序wxss样式的使?来说他的样式属性是什么样的?

【学生】聆听、思考、讨论、小组代表上台回答问题

【教师】总结学生的回答引入要讲的知识,板书“WXSS文件——小程序的

样式”

传授新知【教师】通过学生的发言,引入新的知识,