2022年《Web开发基础》教学大纲 .pdf

1 Web前端设计基础教学大纲适用专业：计算机科学与技术、软件工程、物联网课程类别：非学位课，专业基础课课程学时： 51学时（周 2+1学时）课程编号： 9051404 课程学分： 3 学分一、课程性质Web前端设计基础课程是计算机科学与技术、软件工程、物联网工程专业的一门专业基础课程，以Web 基本概念和 Web标准为基准点、通过对Web 前端主流开发技术的学习和研究，让学生理解和掌握HTML5 、CSS3 以及 JavaScript脚本语言的相关知识，通过这门课程的教学， 不仅使学生通过项目实践培养学生开发和设计Web 站点的基本技能，更要使学生充分了解Web思想，为进一步学习后续课程打下良好的基础。二、课程教学目标与基本要求本课程的教学目标是让学生理解HTML5 、CSS3以及 JavaScript脚本语言的基本语法，掌握常用的 Web 页面布局技术，理解并熟练应用JavaScript常用对象的属性方法，使用 DOM 技术编写页面的客户端程序，通过项目实训，培养学生具备设计实现Web 客户端页面的初步能力。本课程教学基本要求是让学生理解Web 设计的基本原则、栏目和网站目录结构定义、标准页面布局方法、导航菜单制作、图文排版、页面交互等方面的基础知识；能够熟练运用 HTML5 中的文字、链接、列表、表格、表单、图像、多媒体等标记语言设计制作网页；熟练掌握 CSS3 对网页进行布局和修饰的基本方法；掌握JavaScript脚本语言的基本语法，理解对象的概念及使用JavaScript来编写客户端脚本程序。三、课程内容其中标记为难点第一部分第 1章 HTML 5 简介1.1 HTML历史与 HTML 5 1.2 HTML 5 的优势1.3 HTML 5 的基本结构和语法变化1.4 本章小结第 2章 HTML 5 的常用元素与属性2.1 HTML 5 保留的常用元素2.2 HTML 5 新增的通用属性2.3 HTML 5 新增的常用元素2.4 HTML 5 头部和元信息名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 1 页，共 6 页 - - - - - - - - - 2 2.5 HTML 5 新增的拖放 API 2.6 本章小结第 3章 HTML 5 表单相关元素和属性3.1 HTML原有的表单及表单控件3.2 HTML 5 新增的属性与元素3.3 HTML 5 增强的文件上传域3.4 HTML 5 新增的客户端校验3.5 本章小结第 4章 HTML 5 的绘图支持4.1 使用 canvas 元素4.2 绘图4.3 图形特效处理4.4 控制叠加风格4.5 控制填充风格4.6 位图处理4.7 输出位图4.8 本章小结第 5章 HTML 5 的多媒体支持5.1 使用 audio 和 video 元素5.2 使用 JavaScript脚本控制媒体播放5.3 事件监听5.4 本章小结第二部分第 6章 级联样式单与 CSS选择器6.1 样式单概述6.2 CSS 样式单的基本使用6.3 CSS 选择器6.4 伪元素选择器6.5 CSS 3.0 新增的伪类选择器6.6 在脚本中修改显示样式6.7 本章小结名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 2 页，共 6 页 - - - - - - - - - 3 第 7章 字体与文本相关属性7.1 字体相关属性7.2 CSS 3 支持的颜色表示方法7.3 文本相关属性7.4 CSS 3 新增的服务器字体7.5 本章小结第 8章 背景、边框和补丁相关属性8.1 背景相关属性8.2 边框相关属性8.3 补丁相关属性8.4 本章小结第 9章 大小、定位、轮廓相关属性9.1 大小相关属性9.2 定位相关属性9.3 轮廓相关属性9.4 本章小结第 10章 盒模型与布局相关属性10.1 布局相关属性10.2 盒模型和 display属性10.3 对盒添加阴影10.4 CSS 3 的多栏布局10.5 本章小结第 11章 表格、列表相关属性及media query 11.1 表格相关属性11.2 列表相关属性11.3 控制光标的属性11.4 media query功能11.5 本章小结第 12章 变形与动画相关属性12.1 CSS 3 提供的变形支持12.2 CSS 3 提供的 Transition动画12.3 CSS 3 提供的 Animation 动画名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 3 页，共 6 页 - - - - - - - - - 4 12.4 本章小结四、学时分配五、实验安排本课程需要安排实验课，以引导学生正确运用所学知识解决实际问题，实验方法和步骤参见教材。序号教学周次实验名称类型学时1 3 叮叮书店首页内容结构的建立综合2 2 4 叮叮书店首页超连接的使用、叮叮书店首页图像的使用综合2 教学周次教学内容教学环节（学时）讲课习题实验上机课外小计1 第 1 章 Web 技术概述2 2 2 第 2 章 HTML5 基础2 2 3 第 3 章 HTML5 内容结构与文本2 2 4 4 第 4 章 HTML5 超连接第 5 章 HTML5 多媒体2 2 4 5 第 6 章 HTML5 表格第 7 章 HTML5 表单2 2 4 6 第 8 章 CSS 基础2 2 7 第 9 章页面布局定位2 2 8 第 9 章页面布局定位2 2 4 9 第 10 章元素外观属性2 2 4 10 第 11 章伪类和伪元素2 2 11 第 12 章 CSS3 变换、过渡和动画2 2 12 第 13 章页面内容样式设计第 14 章网站制作流程与发布2 2 4 13 第 15 章 ECMAScript基础第 16 章 ECMAScript语句2 2 14 第 17 章行为与对象2 2 4 15 第 18 章 DOM 第 19 章 HTML DOM对象2 2 4 16 第 20 章 HTML5 DOM 2 2 4 17 第 21 章 BOM 2 2 总计34 18 52 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 4 页，共 6 页 - - - - - - - - - 5 3 5 叮叮书店购物车页面的建立、叮叮书店联系我们页面的建立综合2 4 8 叮叮书店首页布局样式设计综合2 5 9 叮叮书店首页外观样式设计综合2 6 12 叮叮书店首页超链接、伪类和动画样式设计、导航菜单综合2 7 14 叮叮书店首页显示日期和时间综合2 8 15 叮叮书店首页图片切换广告的实现、叮叮书店联系我们页面表单数据验证综合2 9 16 叮叮书店书籍分类页面拖放图书到购物车综合2 六、教材Web 前端设计基础 HTML5 、CSS3 、JavaScript 张树明编著清华大学出版社2017.2 七、考核方式及要求考核方式为考查，成绩为百分制，再折合成优秀、良好、中等、及格、不及格。总成绩 = 平时学习过程（ 70% ）+ 开放性考试（ 30% ）平时学习过程考核标准细则考核项目等级标准预习反馈（ 20% ）认真预习， 主动思考， 提出高质量问题，积极向老师反馈。有预习笔记。（3）能够预习， 能够思考， 能够提出问题， 能及时向老师反馈。有预习笔记。（2）能够预习， 但不思考， 没有提出问题， 能及时向老师反馈。有预习笔记。（1）不预习， 不思考， 没有提出问题， 也不及时向老师反馈。没有预习笔记。（0）学习状态（ 10% ）完全投入课堂学习。 （3）学习状态较好。 （2）学习状态差（如迟到、早退、上课吃零食、睡觉、玩游戏等）。 （1）缺勤（病事假、旷课。旷课不允许后补课堂实验，病事假经老师允许可以在规定时间内后补课堂实验，缺勤超过5次及以上视为平时学习过程考核不及格，旷课5 次及以上视为放弃课程考核。） 。 （0）课堂研讨（ 15% ）积极参与课堂讨论，主动发言回答问题并正确，有记录。（4）较好地参与课堂讨论，能够发言回答问题并基本正确，有记录。（3）能够参与课堂讨论，能够发言回答问题，有记录。（2）能够参与课堂讨论，不发言回答问题，无记录。（1）不参与课堂讨论，不发言回答问题，无记录。（0）课堂实验（ 15% ）能在规定的时间内完成实验题目，逻辑清晰，代码规范，结果正确。（3）能在规定的时间内完成实验题目，结果基本正确。（2）能在规定的时间内完成实验题目，但结果不正确。（1）名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 5 页，共 6 页 - - - - - - - - - 6 复制或抄袭，无法回答所作实验相关内容。（0）课外作业或测试 （25% ）独立、认真完成作业。 （4）较好完成作业。 （3）全部完成作业。 （2）未全部完成作业或与要求不符。（1）复制或抄袭。 （0）说明：等级标准标记为数字，值越大者等级越高。课堂研讨和课堂实验不同时记录考核，即课堂研讨和课堂实验共同占15% 。在平时学习过程考核的任何环节发现抄袭或复制者，第一次记为最低等，也就是零分，第二次直接在平时成绩中扣减20 分。平时学习过程考核设立特殊奖励政策，在整个学习过程中，对某些知识点有独创性见解或学习过程中在某些环节表现优异等，经教师认可，可额外加分（1-5 分） ，累加最高分为 5 分，在平时考核分值基础上增加，如果超过70 分，计 70 分。从第三教学周开始，每周都要按学习过程考核标准进行考核，记录考核等级，最后核算为分数，作为平时成绩。考核等级每周公布一次，学生如有疑问，可与教师沟通协商，公布一周后，不得更改。请假超过 5 次（含 5 次） ，平时成绩记为不及格，旷课超过5 次（含 5 次） ，视为放弃本课程考核。请假若有课堂研讨和课堂实验考核可在请假一周内补交。开放性考试考核在规定时间内（ 100 分钟）完成一个指定形式页面的建立。评分标准如下：评分项分值文档结构6 标准布局6 导航菜单6 内容样式6 编码规范6 教学大纲编写者：计算机科学与技术教研室执笔人：张树明名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 6 页，共 6 页 - - - - - - - - -