微信小程序开发-中级 教案 项目4 天气预报页面进行移动端适配

项目4天气预报页面进行移动端适配章节序号章节名称天气预报页面进行移动端适配授课时间授课时长135分钟授课类型理论+实操授课地点教学目标知识目标掌握CSS移动端适配方法，掌握移动端页面常用单位用法；掌握CSS3移动端布局的方法能力目标能够使用移动端常用单位，能够使用CSS完成页面的移动端适配素质目标培养Web移动端页面开发的标准意识教学重点移动端网页开发教学难点媒体查询移动端适配教学方法/教学手段讲解、举例、提问互动教学资源/课前准备讲义PPT、微课视频、在线题库教学过程（分教学步骤列出内容、时间安排、教学方法、训练项目、师生互动等）教学环节教学内容教学设计环节1（5分钟）网页移动端适配的作用主题引入如果在手机端浏览网页，文字将变得特另IJ小，需要用手指进行放大操作，才|自清楚的看清楚内容如何把网页进行移动端适配环节2（40分钟）网页移动端适配基础知识介绍讲解1）视口应用2）媒体查询3）CSS单位环节3（90分钟）天气预报页面进行移动端适配实操练习为页面添加视口，并采用媒体查询功能，调整页面以适应移动端显示教学小结课后作业教学反思。