本书是面向应用型本科、职业本科、高职高专计算机类相关专业的核心课程教材，采用“项目驱动、任务导向”的立体化编写框架，系统覆盖 HTML5 移动 Web 开发的全流程技术体系与实战技能。 本书设计了 10 个递进式项目，从基础认知到综合应用，构建完整的知识与能力培养体系。项目 1“移动Web 开发概述”注重搭建行业与技术框架，讲解移动互联网的发展历程、智能手机的发展及手机浏览器、移动Web 开发与传统桌面 Web 开发的区别，同步完成移动 Web 开发环境配置；项目 2 至项目 4 聚焦核心技术，深入介绍 HTML5 新元素、CSS3 样式、移动端页面布局，通过“知识准备+任务实施”模式夯实技术基础；项目5 至项目 7 拓展应用场景，涵盖基于 HTML5 的移动 Web 应用、数据存储与离线应用、跨平台移动 Web 开发技术，解决实际开发中的兼容性与体验优化问题；项目 8“使用 Bootstrap 进行移动 Web 开发”通过组件与布局体系的应用，提升移动 Web 开发效率；项目 9“AI 辅助移动 Web 开发”紧跟技术前沿，讲解 AI 辅助开发工具在需求转化、代码生成、调试优化中的应用，培养智能开发思维；项目 10“多功能学习平台”作为综合实战，整合前述所有技术，实现课程表页面、音视频页面、数据存储页面、Canvas 签名板页面四大模块，强化工程化应用能力。 全书贯穿“做中学、学中做”的特色，每个任务均包含明确的学习目标、精准的任务描述、详细的任务分析、可落地的任务实施模块，配套完整的代码示例、效果演示图与习题拓展，同时融入行业规范与职业素养培养。本书既适用于课堂教学，也可作为移动 Web 开发初学者的自学指南，助力初学者快速掌握从技术入门到项目实战的全流程技术体系与实战技能，满足企业对移动前端开发岗位的技能需求。
赵峰，副教授，职业资格二级（技师），高校从教28年。毕业于北京交通大学计算机科学与技术专业，现为计算机应用基础教研室主任，中国职业技术教育学会教学工作委员会会员，全国计算机信息高新技术考试考评员。近年来参与或主持厅局级、学会级教育教学改革科研课题三项，发表学术、教育教学改革论文十余篇。研究成果在职教学会、高教学会评比中获得一等奖两项、二等奖和三等奖各一项。代表学校参加省高等职业院校计算机技能大赛（教师组）获得二等奖，2019年参加由广东省教育厅主办的全省职业院校技能大赛职业院校教学能力比赛高职组教学设计赛项，荣获二等奖。指导学生参加各级各类技能大赛三次获得优秀指导教师称号。近五年来参与编写规划教材四本（主编三本、副主编一本）。获得实用新型专利2项。
项目1 移动Web开发概述 1
知识准备 1
任务1.1 认识移动Web开发环境（安装Visual Studio Code） 4
1.1.1 学习目标 4
1.1.2 任务描述 5
1.1.3 任务分析 5
1.1.4 任务实施 5
习题 10
拓展内容 10
项目2 HTML5新元素 11
知识准备 11
任务2.1 HTML5语义化标签
页面构建 21
2.1.1 学习目标 21
2.1.2 任务描述 22
2.1.3 任务分析 22
2.1.4 任务实施 23
任务2.2 创建移动音频播放器 28
2.2.1 学习目标 28
2.2.2 任务描述 28
2.2.3 任务分析 29
2.2.4 任务实施 29
任务2.3 Canvas空心渐变文字
绘制案例 36
2.3.1 学习目标 36
2.3.2 任务描述 36
2.3.3 任务分析 37
2.3.4 任务实施 37
习题 40
拓展内容 41
项目3 CSS3样式 42
知识准备 42
任务3.1 背景 47
3.1.1 学习目标 47
3.1.2 任务描述 47
3.1.3 任务分析 47
3.1.4 任务实施 48
任务3.2 渐变 49
3.2.1 学习目标 49
3.2.2 任务描述 49
3.2.3 任务分析 49
3.2.4 任务实施 50
任务3.3 阴影与边框 51
3.3.1 学习目标 51
3.3.2 任务描述 51
3.3.3 任务分析 52
3.3.4 任务实施 52
任务3.4 CSS3动画 53
3.4.1 学习目标 53
3.4.2 任务描述 53
3.4.3 任务分析 53
3.4.4 任务实施 54
习题 56
拓展内容 56
项目4 移动端页面布局 57
知识准备 57
任务4.1 视口 60
4.1.1 学习目标 60
4.1.2 任务描述 60
4.1.3 任务分析 61
4.1.4 任务实施 61
任务4.2 流式布局 63
4.2.1 学习目标 63
4.2.2 任务描述 63
4.2.3 任务分析 63
4.2.4 任务实施 64
任务4.3 弹性布局 65
4.3.1 学习目标 65
4.3.2 任务描述 65
4.3.3 任务分析 65
4.3.4 任务实施 66
任务4.4 rem布局 70
4.4.1 学习目标 70
4.4.2 任务描述 70
4.4.3 任务分析 70
4.4.4 任务实施 71
习题 73
拓展内容 73
项目5 基于HTML5的移动Web应用 74
知识准备 74
任务5.1 地理定位基础应用 84
5.1.1 学习目标 84
5.1.2 任务描述 84
5.1.3 任务分析 84
5.1.4 任务实施 85
任务5.2 元素拖曳交互 86
5.2.1 学习目标 86
5.2.2 任务描述 86
5.2.3 任务分析 87
5.2.4 任务实施 87
任务5.3 图片预览 90
5.3.1 学习目标 90
5.3.2 任务描述 90
5.3.3 任务分析 91
5.3.4 任务实施 91
习题 92
拓展内容 92
项目6 数据存储与离线应用 94
知识准备 94
任务6.1 使用Web Storage存储用
户偏好设置 100
6.1.1 学习目标 100
6.1.2 任务描述 100
6.1.3 任务分析 101
6.1.4 任务实施 101
任务6.2 使用Service Worker实现
离线访问 103
6.2.1 学习目标 103
6.2.2 任务描述 103
6.2.3 任务分析 104
6.2.4 任务实施 104
习题 110
拓展内容 110
项目7 跨平台移动Web开发技术 111
知识准备 111
任务7.1 移动端touch事件 115
7.1.1 学习目标 115
7.1.2 任务描述 115
7.1.3 任务分析 115
7.1.4 任务实施 116
任务7.2 解决移动端click事件的
延时问题 117
7.2.1 学习目标 117
7.2.2 任务描述 117
7.2.3 任务分析 117
7.2.4 任务实施 118
任务7.3 媒体查询 119
7.3.1 学习目标 119
7.3.2 任务描述 119
7.3.3 任务分析 120
7.3.4 任务实施 120
任务7.4 栅格系统 122
7.4.1 学习目标 122
7.4.2 任务描述 122
7.4.3 任务分析 122
7.4.4 任务实施 123
习题 128
拓展内容 128
项目8 使用Bootstrap进行移动
Web开发 129
知识准备 129
任务8.1 Bootstrap的常用组件 139
8.1.1 学习目标 139
8.1.2 任务描述 139
8.1.3 任务分析 140
8.1.4 任务实施 140
任务8.2 Bootstrap的常用布局
体系 143
8.2.1 学习目标 143
8.2.2 任务描述 143
8.2.3 任务分析 144
8.2.4 任务实施 144
任务8.3 Bootstrap的常用样式 148
8.3.1 学习目标 148
8.3.2 任务描述 148
8.3.3 任务分析 149
8.3.4 任务实施 149
习题 151
拓展内容 151
项目9 AI辅助移动Web开发 152
知识准备 152
任务9.1 图片展示画廊页面制作 162
9.1.1 学习目标 162
9.1.2 任务描述 162
9.1.3 任务分析 163
9.1.4 任务实施 164
任务9.2 简单表单页面开发 166
9.2.1 学习目标 166
9.2.2 任务描述 166
9.2.3 任务分析 167
9.2.4 任务实施 168
任务9.3 学校官网设计稿转化为
前端代码 169
9.3.1 学习目标 169
9.3.2 任务描述 170
9.3.3 任务分析 171
9.3.4 任务实施 171
习题 173
拓展内容 173
项目10 多功能学习平台 174
任务10.1 课程表页面实现 174
10.1.1 学习目标 174
10.1.2 任务描述 174
10.1.3 任务分析 175
10.1.4 任务实施 175
任务10.2 音视频页面实现 189
10.2.1 学习目标 189
10.2.2 任务描述 189
10.2.3 任务分析 190
10.2.4 任务实施 191
任务10.3 数据存储页面实现 193
10.3.1 学习目标 193
10.3.2 任务描述 193
10.3.3 任务分析 193
10.3.4 任务实施 194
任务10.4 Canvas签名板页面实现 197
10.4.1 学习目标 197
10.4.2 任务描述 197
10.4.3 任务分析 198
10.4.4 任务实施 199
习题 204
拓展内容 204
书单推荐
