Web前端开发 教案全套周苏峡 1 Web基础知识教案13jQuery效果.docx

《Web前端开发 教案全套周苏峡 1 Web基础知识教案13jQuery效果.docx》由会员分享，可在线阅读，更多相关《Web前端开发 教案全套周苏峡 1 Web基础知识教案13jQuery效果.docx（72页珍藏版）》请在第一文库网上搜索。

1、任务1Web基础知识案例载体务需要具备的常用技术。项目内容Web基础知识项目学时2任务内容了解在信息时代进行资源共享的重要性和技术方法任务学时2授课班级计应、网络、物联网、艺术设计等专业授课日期2023.12.01授课地点理实一体多媒体教室、中国慕课网主讲教师周苏峡任务实施背景本讲内容介绍Web的基本概念,使学生了解互联网在我国的发展和应用和常用的Web开发技术。了解在信息时代进行资源共享的重要性和快速进行信息浏览查询的基本方法。任务完成效果图八eatMCMMKI我才,绰台at基与实ItK3*Ba*Mnrvem*rwnNMvwUX-制片州二三不EIiXX;=I二,.IMNar芳H*.2h一教学

2、目标能力目标 能够掌握在互联网上获取信息的手段和方法； 能够掌握Web的基本概念； 能够快速通过互联网获取信息； 能够了解常用的Web开发技术，对Web标准有一定了解。知识目标 了解互联网的产生和发展 了解互联网技术在我国的发展和应用 掌握信息浏览的基本方法 了解常用的网页开发技术素质目标 培养工作责任感和细致的工作作风； 培养对待作品精益求精的工匠精神； 培养前端设计师在Web页面制作时应具备的分析问题、解决问题的能力； 培养学生具有团队协作精神和沟通能力； 培养学生具备自主学习和知识更新的能力。网站开发团队接到客户网站设计的订单，客户提供了页面效果图，提出网站功能任务重点获取信息的方法常用

3、Web前端开发方法处理方法视频配合详细讲解任务难点Web前端开发方法处理方法建立感性认识，用实际案例充分讲解需求，本任务是完成客户调查和需求分析，了解任务运行的环境性能要求以及完成任Web前端开发课堂教学方案任务21HTM1概述任务2.2HTM1文档结构、标签的公共属性项目内容HTM1基础知识项目学时18任务内容HTM1概述、HTM1文档结构及HTM1标签的全局属性任务学时2授课班级计应、网络、物联网、艺术设计等专业授课日期2023.12.01授课地点理实一体多媒体教室、中国慕课网主讲教师周苏峡任务实施背景根据用户需求设计并实现网页,任务要求学生掌握HTM1的概念、网页文档的基本结构及网页中常

4、用的显示元素，以及这些元素有哪些基本公共属性、这些属性代表的含义。任务完成效果图S.B.tmM*1RMK-.w.fnm1.rMMHam1.VPMrkM1Mm,nvwIIowB-ra)教学目标能力目标 能够掌握HTM1的基本概念； 掌握网页文档的基本结构； 能够掌握页面元素的基本属性及含义。知识目标 HTM1的基本概念 HTM1文档基本结构 HTM1的标签的公共属性素质目标 培养工作责任感和细致的工作作风； 培养对待作品精益求精的工匠精神； 培养前端设计师在Web页面制作时应具备的分析问题、解决问题的能力； 培养学生具有团队协作精神和沟通能力； 培养学生具备自主学习和知识更新的能力。案例载体网站

5、开发团队接到客户网站设计的订单，客户提供了页面效果图，提出网站功能需求，本次课是根据任务需求分析页面显示元素，通过哪些属性控制元素的特性。任务重点 HTM1概述 HTM1文档的基本结构 常用HTM1标签的公共属性处理方法视频配合详细讲解任务难点HTM1文档的基本结构HTM1标签的公共属性处理方法建立感性认识，用实际案例充分讲解Web前端开发课堂教学方案任务2.3HTM1标签（1）.标题、线条、段落、注释项目内容HTM1基础知识项目学时18任务内容span和div、HTM1的标题、线条、段落、注释任务学时4授课班级计应、网络、物联网、艺术设计等专业授课日期2023.12.01授课地点理实一体多媒

6、体教室、中国慕课网主讲教师周苏峡任务实施背景根据用户需求设计并实现网页,任务要求学生掌握HTM1的常用标签。本任务学习HTM1的容器、文档标题、线条、段落、（条件）注释等标签。任务完成效果图OX1Mi行I教学目标能力目标能够掌握HTM1的基本标签；能够在网页文档中添加基本元素；能够设置页面元素的基本属性。知识目标掌握以下HTM1标签：span、div、tit1ehrbr、p、!一.一素质目标 培养工作责任感和细致的工作作风； 培养对待作品精益求精的工匠精神； 培养前端设计师在Web页面制作时应具备的分析问题、解决问题的能力； 培养学生具有团队协作精神和沟通能力； 培养学生具备自主学习和知识更新

7、的能力。案例载体网站开发团队接到客户网站设计的订单，客户提供了页面效果图，提出网站功能需求，本次课是根据任务需求分析页面显示元素，通过哪些属性控制元素的特性。任务重点HTM1基本标签处理方法视频配合详细讲解任务难点hr标签HTM1的条件注释处理方法建立感性认识，用实际案例充分讲解Web前端开发课堂教学方案任务2.3HTM1标签（2）HTM1文档中的图片与超链接项目内容HTM1基础知识项目学时18任务内容HTM1文档中的图片与超链接任务学时4授课班级计应、网络、物联网、艺术设计等专业授课日期2023.12.01授课地点理实一体多媒体教室、中国慕课网主讲教师周苏峡任务实施背景根据用户需求设计并实现

8、网页,任务要求学生掌握HTM1中加入图片及超链接的方法，使页面更加美观，用户浏览更加方便。任务完成效果图M白幡文件htmihrFK%.M1M47目射111wiiuii4f-ei.htm1hrfH”文纣CibT*tef.1rXh.btaa教学目标能力目标能够在页面中插入图片；能够在页面中插入超级链接；知识目标掌握以下HTM1标签：素质目标 培养工作责任感和细致的工作作风； 培养对待作品精益求精的工匠精神； 培养前端设计师在Web页面制作时应具备的分析问题、解决问题的能力； 培养学生具有团队协作精神和沟通能力； 培养学生具备自主学习和知识更新的能力。案例载体网站开发团队接到客户网站设计的订单，客户

9、提供了页面效果图，提出网站功能需求，本次课是根据任务需求插入图片及超级链接。任务重点HTM1的图片标签和超链接标签处理方法视频配合详细讲解任务难点锚点链接处理方法建立感性认识，用实际案例充分讲解Web前端开发课堂教学方案任务2.3HTM1标签（3）列表、表格、表单项目内容HTM1基础知识项目学时18任务内容HTM1文档中的列表、表格、表单任务学时4授课班级计应、网络、物联网、艺术设计等专业授课日期2023.12.01授课地点理实一体多媒体教室、中国慕课网主讲教师周苏峡任务实施背景根据用户需求设计并实现网页,任务要求学生掌握HTM1中加入列表、表格、表单的方法，使页面数据展示更加规整和美观,并为

10、后续与服务器交互数据打下基础。任务完成效果图邕2Bwomom111MMM教学目标能力目标能够在页面中插入列表、表格、表单等元素；知识目标掌握以下HTM1标签：、tab1e）、素质目标 培养工作责任感和细致的工作作风； 培养对待作品精益求精的工匠精神； 培养前端设计师在Web页面制作时应具备的分析问题、解决问题的能力； 培养学生具有团队协作精神和沟通能力； 培养学生具备自主学习和知识更新的能力。案例载体网站开发团队接到客户网站设计的订单，客户提供了页面效果图，提出网站功能需求，本次课是根据任务需求插入列表、表格、表单。任务重点列表、表格、表单等元素处理方法视频配合详细讲解任务难点表单的有关属性处

11、理方法建立感性认识，用实际案例充分讲解Web前端开发课堂教学方案任务2.3HTM1标签（4）框架网页、浮动框架任务24HTM1预留字符项目内容HTM1基础知识项目学时18任务内容框架网页、浮动框架、HTM1预留字符任务学时4授课班级计应、网络、物联网、艺术设计等专业授课日期2023.12.01授课地点理实一体多媒体教室、中国慕课网主讲教师周苏峡任务实施背景根据用户需求设计并实现网页,任务要求实现在同一界面显示多个页面内容的效果。学生需要掌握制作框架网页以及在页面中应用浮动框架的方法，使用户浏览更加方便,信息内容并一目了然。任务完成效果图.广(*OB*W4M-e!Iab40aa教学目标能力目标

12、能够制作框架网页； 能够在页面中插入浮动框架； 能够在页面中插入特殊字符效果知识目标掌握以下HTM1标签：frame、HTM1转义字符素质目标 培养工作责任感和细致的工作作风； 培养对待作品精益求精的工匠精神； 培养前端设计师在Web页面制作时应具备的分析问题、解决问题的能力； 培养学生具有团队协作精神和沟通能力； 培养学生具备自主学习和知识更新的能力。案例载体网站开发团队接到客户网站设计的订单，客户提供了页面效果图，提出网站功能需求，本次课是根据任务需求制作框架网页以及在页面中插入浮动框架。任务重点处理方法视频配合详细讲解任务难点浮动框架的应用处理方法建立感性认识，用实际案例充分讲解Web前端开发课堂教学方案任务3.1CSS概述任务3.2CSS语法任务3.3CSS选择器项目内容网页外观控制项目学时20任务内容CSS概述、CSS的基本语法、CSS的选择器任务学时6授课班级计应、网络、物联网、艺术设计等专业授课日期2023.12.01授课地点理实一体多媒体教室、中国慕课网主讲教师周苏峡任务实施背景根据用户需求设计并实现网页,任务要求将页面美化，包括页面布局、及其他元素的控制。任务完成效果图八eatMCMMKI我才,绰台at基与实ItK3*Ba*Mnrvem*rwnNMvwUX-制片州二三不EIy_一一_J_I