HTML5移动Web开发

近些年，移动互联网迅速进入人们的生活、工作中。在移动互联网中起支撑作用的网页、APP等开发技术也已经成熟。除了原生的Android与iOS外，HTML5也是移动Web技术中不可忽视的一种开发模式。

黑马程序员，“中关村黑马程序员训练营”是由传智播客教育科技有限公司（简称传智播客）联合中关村软件园、CSDN，并委托传智播客进行教学实施的软件开发高端培训机构，致力于服务各大软件企业，解决当前软件开发技术飞速发展，而企业招不到很好人才的困扰。 目前，“中关村黑马程序员训练营”已成长为行业“学员质量好、课程内容深、企业满意”的移动开发高端训练基地，并被评为中关村软件园重点扶持人才企业。

第1章
移动互联中的Web应用1
1.1移动互联网的发展1
1.2移动Web开发概述.3
1.2.1移动开发的几种方式3
1.2.2移动Web开发与PC端Web开发的区别4
1.3移动端的Web浏览器4
1.4基于HTML5的移动Web开发5
小结7
思考题7
第2章
基于HTML5的移动Web应用（上）8
2.1HTML5的网络存储8
2.1.1WebStorage简介9
2.1.2localStorage10
2.1.3sessionStorage12
2.1.4Storage事件监听14
2.2移动Web离线应用15
2.2.1离线应用简介15
2.2.2ApplicationCache的基本应用16
2.2.3applicationCache对象20
2.2.4离线缓存更新21
2.3HTML5画布22
2.3.1初识canvas22
2.3.2利用canvas绘制矩形和清除矩形25
2.3.3利用canvas绘制圆形27
2.3.4利用canvas绘制图片28
2.3.5利用canvas其他方法30
小结31
思考题31
第3章
基于HTML5的移动Web应用（下）32
3.1视频与音频32
3.1.1＜video＞标签的使用33
3.1.2HTMLDOMVideo对象35
3.1.3＜audio＞标签的使用38
3.1.4HTMLDOMAudio对象39
3.2Geolocation地理定位42
3.2.1Geolocation简介42
3.2.2获取当前位置42
3.2.3调用百度地图45
3.3拖曳49
3.4文件操作52
3.4.1选择文件53
3.4.2操作文件55
小结59
思考题59
第4章
移动端页面布局和常用事件60
4.1流式布局60
4.2视口62
4.2.1理解视口62
4.2.2移动端的3种视口63
4.3移动端常用事件65
4.3.1Touch事件简介65
4.3.2Touch事件的应用67
4.3.3过渡和动画结束事件70
小结75
思考题75
第5章
综合项目——黑马
掌上商城76
5.1项目简介76
5.1.1项目功能展示77
5.1.2项目目录和文件结构77
5.1.3项目开发流程78
5.2商城首页80
5.2.1【任务1】项目搭建80
5.2.2【任务2】页面主体和头部搜索83
5.2.3【任务3】轮播图87
5.2.4【任务4】导航栏92
5.2.5【任务5】商品95
5.3商品分类页102
5.3.1【任务6】顶部通栏102
5.3.2【任务7】左侧栏104
5.3.3【任务8】右侧栏109
5.4购物车页面114
5.4.1【任务9】购物车页面114
5.4.2【任务10】弹出框动画122
5.5Zepto.js127
5.5.1Zepto模块127
5.5.2Zepto的使用128
小结129
思考题130
第6章
跨平台移动Web技术131
6.1响应式Web设计131
6.1.1响应式Web设计简介132
6.1.2响应式Web设计相关技术133
6.2媒体查询133
6.3栅格系统136
6.4弹性盒布局139
小结146
思考题146
第7章
使用Bootstrap进行移动Web开发147
7.1初识Bootstrap147
7.1.1Bootstrap简介147
7.1.2Bootstrap下载148
7.1.3Bootstrap基本模板150
7.2Bootstrap常用布局151
7.2.1布局容器151
7.2.2栅格系统152
7.2.3响应式工具154
7.3Bootstrap常用样式157
7.3.1导航栏157
7.3.2表单161
7.3.3按钮166
7.3.4标签页168
7.3.5轮播插件170
小结174
思考题174
第8章
综合项目——黑马财富175
8.1项目简介176
8.1.1项目功能展示176
8.1.2项目目录和文件结构178
8.1.3项目开发流程179
8.2【任务1】index.html页面结构搭建180
8.3【任务2】顶部通栏模块182
8.4【任务3】导航栏模块186
8.5【任务4】轮播图模块191
8.6【任务5】信息和预约模块197
8.7【任务6】产品模块203
8.8【任务7】新闻和合作伙伴模块213
小结222
思考题222