这门课会讲什么？

本课程会系统介绍H5技术及典型响应式前端框架——Bootstrap。包括HTML5、CSS3新增技术和使用技巧，JavaScript语言特性，Bootstrap基本结构、Bootstrap CSS、Bootstrap布局组件和Bootstrap插件几个部分。

本课程通过WEB前端高级语言讲授程序设计的基本工作原理，要求学生能够熟练掌握掌握html5的概述和语义化标签的概念和使用方法，熟练掌握HTML5语言基础语法，能够使用html5语言编写炫酷的网站；熟练掌握手工响应式网页的编写技术，熟悉Bootstrap框架的基本结构、组成和使用技巧，能够自如地编写响应式网页。另一方面，兼顾实用软件的使用和计算机应用领域前沿知识，为学生进一步学习计算机后续知识打下坚实的基础。

单元一：HTML5+CSS3初体验

任务一、绘制HTML5logo

任务二、构建移动版旅游网站页面

单元二：文本类网页设计

任务一、电子杂志页面

任务二、软文推广页面

单元三：图文展示网页设计

任务一、黑马书城

任务二、多肉植物商场

单元四：HTML5表单应用

任务一、移动版登录页面

任务二、用户注册页面

单元五：HTML5画布

任务一、构建网页涂鸦板

任务二、构建发红包才能看的照片页面

单元六：音频和视频

任务一、视频播放器

任务二、HTML5 web钢琴

单元七：响应式Web设计

任务一、环保网站

任务二、社交网站个人信息页面制作

单元八：响应式设计神器——Bootstrap

任务一、Bootstrap餐饮类网站首页——header

任务二、Bootstrap餐饮类网站首页——搜索模块

任务三、Bootstrap餐饮类网站首页——热卖商品区

任务四、Bootstrap餐饮类网站首页——特色推荐模块

任务五、Bootstrap餐饮类网站首页——轮播广告模块

任务六、Bootstrap餐饮类网站首页——footer

任务七、Bootstrap餐饮类网站首页整合

本课程适用于软件技术和移动应用开发专业，要求学生具备一定的前端开发知识，如HTML、CSS及JavaScript编程等。

1．《响应式Web开发项目教程》，作者：黑马程序员，出版社：人民邮电出版社

2．联想资料

3． https://v3.bootcss.com/

4. 《Bootstrap实战从入门到精通》 未来科技.中国水利水电出版社

软件：windows操作系统， HBuilder， Chrome浏览器

硬件：常规配置的笔记本、台式机均可

资料：BootStrap框架、jQuery框架、HTML5中文手册、CSS3中文手册、BootStrap中文手册

通过学习本课程，学习者将熟知页面布局，熟练掌握网页样式美化，并具备运用HTML5、CSS3开发出用户体验良好的移动端交互界面，完成响应式页面设计、布局、页面交互、网页特效的能力。课程中还将讲解Bootstrap框架的基础，通过学习这些内容，学习者将可以轻松创建Web项目。

响应式网页设计又称为自适应网页设计、回应式网页设计，是一种现代网页设计方法，该设计使得网页能适应不同设备，即根据设备的分辨率和尺寸自动重新布局，同时减少缩放、平移和滚动，有效改善用户体验。在移动设备快速普及的今天，特别是手机屏幕尺寸繁多的情况下，这种设计理念更加有实际意义。

    本课程会系统介绍H5技术及典型响应式前端框架——Bootstrap。包括HTML5、CSS3新增技术和使用技巧，JavaScript语言特性，Bootstrap基本结构、Bootstrap CSS、Bootstrap布局组件和Bootstrap插件几个部分。Bootstrap来自Twitter，是目前最受欢迎的响应式前端框架。Bootstrap是基于HTML、CSS、JavaScript的，它简洁灵活，使得Web开发更加快捷。课程中将讲解Bootstrap框架的基础，通过学习这些内容，学习者将可以轻松创建Web项目。