《前端Web开发基础》课程标准.docx

1、前端Web开发基础课程标准前端 Web 开发基础课程标准表 1 课程基本信息课程类别专业课总学时64 （ 理论： 实验： 32 ）学分3开设学期第九学期适用专业“3+4”分段培养计算机应用技术（中职）与软件工程（本科）专业授课方式理论+实验执笔人审核人制定时间2015.01（一）课程性质与任务课程性质： Web开发基础是软件工程专业培养课程体系中的一门专业必修课程，其包含了软件行业 Web开发领域的关键技术基础知识（ HTML，CSS及 JavaScript 等）。该课程 的设置充分考虑了其在 Web开发领域的关键性作用、 目前市场广泛的应用需求和良好的就业 前景，注重学生对理论基础知识、专业

2、技能的理解、掌握。课程任务：通过本课程的学习，使学生理解 HTML、 CSS及 JavaScript 等基本的理论知识；掌握应用上述理论知识，制作基本网页、 设计网页布局、 实现多样化及良好客户体验的 页面效果等应用技能；培养学生的创新意识，设计特色网页。（二）课程教学目标通过本课程的学习， 使学生掌握 Web开发技术的基本理论知识， 具备一定的应用开发技 能，培养学生工程意识、创新能力和素质。1.知识目标（ 1）了解本课程内容在 Web开发领域的定位与作用；（ 2）了解 HTML、CSS及 JavaScript 技术的发展脉络、趋势及应用前景；（ 3）掌握 HTML中的基本元素、文字与段落元

3、素、图像元素、列表元素、表格元素、超 链接元素、多媒体元素、框架元素及表单元素的语法、属性和参数等基础知识；（ 4）掌握 CSS中元素的语法、属性和参数等基础知识；（ 5）了解网页布局的几种方法，掌握使用 CSS进行网页布局、样式设计的基础知识；（ 6）掌握 JavaScript 中的基本语法知识；（ 7）掌握 JavaScript 进行提交内容校验、生成网页特效等方法。2.能力目标（ 1）具备使用 HTML制作包含基本内容的网页的能力；（ 2）具备使用 HTML及 CSS等技术来设计网页布局的能力；（ 3）具备使用 JavaScript 技术来提高网页交互性、体验性的能力；（ 4）具备综合使

4、用 HTML、 CSS与 JavaScript 的相关知识，来丰富、渲染网页的能力； （5）具备根据具体应用需求，创新性地设计网页的能力。3.素质目标（1）培养学生具备克服困难解决问题的意志；（2）培养学生养成严谨认真的科学态度，耐心细致的工作作风；（3）培养学生具备良好的交流沟通素养和创新精神。64 （ 理论： 32 实验： 32）（四）课程学分4 学分（五）课程内容和要求（理论 48 学时，实验 16 学时）本课程的主要内容有： HTML，主要包括网页基本组成元素，网页框架、超文本链接、表 单、表格、层等。 CSS，产要包括修改网页元素，主要包括修改文字颜色及背景、调整字符 间距、单词间距

5、、添加文字修饰、设置文本排列方式、设置段落缩进、调整行高、转换英文 大小写、设置颜色、设置背景颜色、插入背景图片、设置背景图片位置、设计边框样式、调 整边框宽度、设置边框颜色、设置边框属性等。 JavaScript ，包括 JavaScript 基本语法、 基本数据类型、 运算符、 函数、JavaScript 事件分析、 图片和多媒体文件的使用、 JavaScript 对象的应用、浏览器内部对象、内置对象和方法等。本课程要求学生了解 web编程技术的产生和发展过程， 会使用 HTML编写网页， 会用 CSS 对网页样式进行设计，会使用 JavaScript 实现一些客户端的数据验证及网页特效，

6、达到一 般企业用人标准。表 2 课程内容与学时安排表序号教学项目教学内容与教学要求活动设计建议参考课时 （理论 +实验）1第 1 章 HTML、 CSS 、 JavaScript 综 述1.1 这就是 HTML、 CSS、 JavaScript 的代码1.2 HTML、CSS、JavaScript 各自的角色1.3 如何学习 HTML、 CSS、 JavaScript1.4 小 实 例 HTML、（1）采用理论课讲授 形式（2）布置学生提前预 习，查找资料， 课堂讲 授中， 穿插发言、讨论 的形式，来进行授课2CSS、 JavaScript 的1.4 综合应用2第2章 HTML基础介绍2.1

7、HTML 文档的结构2.2 HTML 基本语法2.3 HTML 文件的命名2.4 编写 HTML文件的注意 事项（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，编写一个 HTML简 单文件进行示例讲解23第3章 HTML文件的整体结构3.1 文件头部内容3.2 主体内容（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出关于 的 程序示例进行讲解24实验 1 制作简 单的 HTML页面使用网页基本组成元素， 编写一个简单的 HTML 页 面，运行查看效果（1）采用实验课形式（2）建议布置学生提 前复习所学习的相关 HTML元素的语法、 属性 及参

8、数知识25第 4 章 文字与段落4.1 编辑内容4.2 文字效果4.3 文字修饰4.4 段落4.5 小实例文字网页（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出关于文字与段 落元素的的程序示例 进行讲解26第 5 章 建立和 使用列表5.1 列表类型5.2 嵌套列表5.3 小实例列表在网 页中的使用（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出关于列表的程 序示例进行讲解27第 6 章 超链接6.1 超链接概述6.2 超链接的路径（1）采用理论课讲授形式26.3 超链接的建立6.4 设置图像映射6.5 小实例超链接的 使用（2）布置学

9、生提前预 习，除讲授基本知识 外，给出超链接的程序 示例进行讲解8第 7 章 表格的应用7.1 表格概述7.2 插入表格7.3 设置表格标记属性7.4 设置表格行与单元格7.5 表格嵌套7.6 小实例表格在网 页中的应用（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出表格相关的程 序示例进行讲解49实验 2 练习使 用表格和和列 表要求使用表格、列表对数据进行格式化的显示（1）采用实验课形式（2）建议布置学生提 前复习所学习的表格、 列表等元素的语法、 属 性及参数知识210第 8 章 层的应 用8.1 图 层 的 创 建 8.2 创建嵌套图层8.3 层的属性设置8

10、.4 小实例图层的实 际应用（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出图层相关的程 序示例进行讲解311第 9 章 框架的应用9.1 框架概述9.2 框架的基本结构9.3 设置框架9.4 设 置 框 架 集 9.5 浮动框架9.6 在框架上建立链接9.7 小实例框架的实 际应用（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出框架相关的程 序示例进行讲解312实验 3 练习使用框架练习使用框架，来规划、 设计页面内容，包括使用 及 框（1）采用实验课形式（2）建议布置学生提 前复习所学习的框架2架技术元素的语法、 属性及参 数知识13

11、第 10 章 表单的应用10.1 表单概述10.2 表单标记10.3 信息输入10.4 小 实 例 表 单 的 实际应用（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出表单相关的程 序示例进行讲解214实验 4 练习使用表单练习使用表单，包括其 action 及 method 属性，并 练习使用表单中的元素， 包括文本框、列表框、文 本域、单选框、复选框和 按钮等内容（1）采用实验课形式（2）建议布置学生提 前复习所学习的表单 及表单内相关元素的 语法、属性及参数知识215第 11 章 CSS 样 式表基础11.1 CSS 的概述11.2 CSS 的使用11.3 插

12、入 CSS样式表11.4 编写 CSS文件（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出使用 CSS、编 写简单 CSS的程序示例 进行讲解216第 12 章 字体的设置12.1 设 置 字 体 font-family12.2 设 置 字 号 font-size12.3 设 置 字 体 样 式 font-style12.4 设 置 字 体 加 粗 font-weight12.5 设 置 字 体 变 体 font-variant12.6 组合设 置字体 属性 font12.7 小实例综 合设（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出

13、通过 CSS设置 字体相关的程序示例 进行讲解2置字体17实验 5 练习使 用 CSS 对字体 进行设置练习使用 CSS，在 HTML文 件里进行调用，对字体进 行设置，包括了对字体、 字号、字体样式、加粗、 字体变体、字体属性等的 设置（1）采用实验课形式（2）建议布置学生提 前复习所学习的表单 及表单内相关元素的 语法、属性及参数知识218第 13 章 文本 的精细排版13.1 调 整 字 符 间 距 letter-spacing13.2 调 整 单 词 间 距 word-spacing13.3 添 加 文 字 修 饰 text-decoration13.4 设置文 本排列 方式 text

14、-align13.5 设 置 段 落 缩 进 text-indent13.6 调 整 行 高 line-height13.7 转 换 英 文 大 小 写 text-transform13.8 小实例综 合应 用文本属性（1）采用理论课讲授 形式（2）布置学生提前预 习，除讲授基本知识 外，给出 CSS对文本进 行精密排版相关的程 序示例进行讲解219实 验 6 使 用 CSS 来 对 文 本 进行精细排版要求编写 CSS文件，在 HTML 文件里进行调用， 控制 DIV 显示效果，练习调整字符 间距、单词间距、文字修 饰、文本排列方式、段落 缩进、行高英文大小写等 内容（1）采用实验课形式（2）建议布置学生提 前复习所学习的 CSS语 法知识220第 14 章 图片 和多媒体文件 的使用14.1 图片14.2 滚动文字14.3 插