《Bootstrap框架》教学大纲.doc

PAGE

PAGE4

《Bootstrap框架》教学大纲

一、课程的基本描述

课程名称：

Bootstrap框架

Bootstrapframework

课程编号：

课程类型：

专业限选课

适用专业：

软件工程专业

参考教材：

理论

上机

总学时：

46学时

理论学时：

24学时

上机学时：

22学时

学分：

2学分

建议开课学期：

第4学期

前导课程：

计算机基础、计算机网络、网页制作

后续课程：

Javaweb、php、python

课程简介

本课程是高等院校计算机类本科专业教学计划中的一门专业考查课。Bootstrap是基于HTML、CSS、JAVASCRIPT的，它简洁灵活，使得Web开发更加快捷。通过本课程的学习，使学生能够熟练利用bootstrap框架来进行网页开发，掌握bootstrap中包含的重要知识点，同时具备独立开发网页、与团队协作的能力。

CoursesDescription

Thiscourseisaprofessionalexaminationcourseintheteachingplanofcomputerundergraduatemajorsincollegesanduniversities.BootstrapisbasedonHTML,CSS,JAVASCRIPT,itisconciseandflexible,makingWebdevelopmentfaster.Throughthestudyofthiscourse,studentscanusethebootstrapframeworktodevelopwebpagesproficiently,mastertheimportantknowledgepointscontainedinbootstrap,andhavetheabilitytoindependentlydevelopwebpagesandcollaboratewithteams.

二、课程目标定位

（一）课程教学目标

课程目标1．建立和掌握web网页设计的思想方法。

课程目标2．能够根据项目需求，独立实现页面美化与布局，利用bootstrap框架进行页面的设计、编码、调试、维护能力。

课程目标3．能够根据上机实践的要求，掌握课程知识点，提高学生的实践动手能力。

（二）课程目标与毕业要求的关系

表1本课程对毕业要求及其指标点的支撑

毕业要求

毕业要求指标点

本课程占该指标点的达成度

课程目标

1

2

3

3.设计/开发解决方案

3.4能够针对需求和目标，完成软件系统的设计并在设计中体现创新意识。

0.4

√

5.使用现代工具

5.2能够开发、选择和使用恰当的现代工程工具和信息技术工具，对复杂软件系统进行分析、设计与构建。

0.4

√

9.个人和团队

9.2能够在软件项目团队合作中独立思考并承担不同团队角色的相应职责，具备有效运作、组织协调能力。

0.2

√

三、课程教学内容

（一）理论部分

表2课程理论教学内容与课程目标的关系

序号

知识单元

知识点（掌握程度，重要程度）

教学要求

推荐学时

对应课程目标

重点

难点

讲授方法

1

初识Bootstrap

1.使学生掌握Bootstrap的概念、特点及组成

2.使学生了解PC端浏览器和移动端浏览器的区别

1.Bootstrap的特点

2.Bootstrap的组成

3.VisualStudioCode基本使用

移动Web开发的主流方案

多媒体、板书

2

1

2

移动Web开发基础（上）

1.使学生掌握视口的基本概念和使用方法

2.使学生掌握移动Web页面的样式编写方法

3.使学生理解分辨率和设备像素比的概念

4.使学生掌握二倍图的使用方法

5.使学生掌握SVG矢量图的使用方法

利用meta标签设置视口、移动Web页面的样式编写

背景图片的缩放、实现背景图片的二倍图

SVG标签和样式、从外部引入SVG文件

1.设置移动端的特殊样式、分辨率和设备像素比

2.SVG标签和样式、从外部引入SVG文件

多媒体、板书

2

1

3

移动Web开发基础（下）

1.使学生掌握HTML5新增API的使用

2.使学生掌握移动端常用事件的使用

3.使学生掌握移动端常用插件的使用

1.检测网络连接、全屏操作、文件读取、拖曳、播放视频和音频、

2.Touch事件实现轮播图效果、Fastclick插件的使用、利用Fastclick处理点透事件

3.i