咖啡商城项目导引 1
学习目标 1
内容安排 2
项目背景 2
项目构思 3
第1章 开发工具HBuilder 5
1.1 飞速编码的极客工具 6
1.2 安装HBuilder 6
1.3 认识界面 8
1.4 新建项目 9
1.5 Web项目的运行 11
1.6 移动App的运行 12
第2章 HTML基础 15
2.1 认识HTML 16
2.1.1 HTML基本语法 16
2.1.2 HTML文档的基本结构 17
2.1.3 项目：第一个HTML页面 18
2.2 HTML常用标签 19
2.2.1 文本与标签 19
2.2.2 项目：介绍我的学校1 23
2.3 表格元素 24
2.3.1 表格标签 25
2.3.2 项目：图书统计表 26
2.4 表单元素 27
2.4.1 常用表单元素 27
2.4.2 项目：个人信息统计表 31
2.5 咖啡商城——商品分类模块 33
2.5.1 项目说明 34
2.5.2 项目设计 34
2.5.3 项目实施 34
习题 36
第3章 HTML5新增元素和属性 37
3.1 新增文档结构元素 38
3.1.1 认识HTML5 38
3.1.2 HTML5页面结构 39
3.1.3 HTML5主体结构元素 39
3.1.4 HTML5非主体结构元素 42
3.1.5 项目：新闻评论网 43
3.2 新增表单元素 45
3.2.1 HTML5表单新功能 45
3.2.2 HTML5表单新的输入类型 46
3.2.3 HTML5表单新的属性 47
3.2.4 项目：订货人个人信息页 49
3.3 咖啡商城——用户注册模块实现 51
3.3.1 项目说明 51
3.3.2 项目设计 52
3.3.3 项目实施 52
习题 54
第4章 CSS基础 56
4.1 CSS基本语法 57
4.1.1 CSS语句格式 57
4.1.2 CSS选择符 58
4.1.3 项目：世界杯胜负榜 64
4.2 文本和字体相关属性 66
4.2.1 字体属性 66
4.2.2 文本属性 69
4.2.3 项目：介绍我的学校2 70
4.3 背景和边框相关属性 72
4.3.1 边框 72
4.3.2 边框阴影 75
4.3.3 圆角边框 76
4.3.4 图形边框 76
4.3.5 背景 77
4.3.6 项目：校训Logo 80
4.4 咖啡商城——网站页脚模块实现 82
4.4.1 项目说明 82
4.4.2 项目设计 82
4.4.3 项目实施 82
习题 84
第5章 CSS盒子模型 87
5.1 盒子相关属性 88
5.1.1 内边距和外边距 88
5.1.2 块级元素与行内元素 90
5.1.3 项目：盒子模型 92
5.2 浮动定位 93
5.2.1 float属性 93
5.2.2 clear属性 95
5.2.3 项目：3个相框 95
5.3 位置定位 97
5.3.1 position属性 97
5.3.2 项目：照片墙 99
5.4 隐藏与显示 101
5.4.1 visibility属性 101
5.4.2 z-index属性 102
5.4.3 display属性 103
5.4.4 项目：悬浮菜单 103
5.5 咖啡商城——商品分类模块美化效果实现 105
5.5.1 项目说明 105
5.5.2 项目设计 106
5.5.3 项目实施 106
习题 109
第6章 CSS3动画 113
6.1 Animation动画 114
6.1.1 定义关键帧 114
6.1.2 绑定动画 115
6.1.3 项目：跑动的汽车 116
6.2 Transition动画 118
6.2.1 Transition过渡 118
6.2.2 项目：页面切换效果 119
6.3 咖啡商城——商品介绍模块实现 122
6.3.1 项目说明 122
6.3.2 项目设计 123
6.3.3 项目实施 123
习题 125
第7章 JavaScript基础 126
7.1 JavaScript简介 127
7.2 在HTML页面中嵌入JavaScript的方法 128
7.3 JavaScript的语法规则 129
7.3.1 语法 129
7.3.2 标识符 130
7.3.3 注释 131
7.3.4 项目：第一个JavaScript程序 131
7.4 数据类型 133
7.4.1 常用数据类型 133
7.4.2 typeof运算符 133
7.4.3 Undefined类型 134
7.4.4 Null类型 134
7.4.5 Object类型 135
7.5 变量 136
7.6 运算符 137
7.7 流程控制语句 138
7.8 JavaScript函数 140
7.8.1 JavaScript函数定义 140
7.8.2 项目：单击我 142
7.9 事件和事件处理 144
7.9.1 JavaScript常用事件 144
7.9.2 项目：敏感的兔子 145
习题 148
第8章 JavaScript对象 151
8.1 内置对象 152
8.1.1 认识JavaScript内置对象 152
8.1.2 Math对象 153
8.1.3 Date对象 154
8.1.4 String对象 156
8.1.5 Number对象 158
8.1.6 Array对象 160
8.1.7 项目：数字电子时钟 162
8.2 BOM对象 164
8.2.1 认识BOM对象 164
8.2.2 window对象 166
8.2.3 history对象 168
8.2.4 location对象 169
8.2.5 screen对象 169
8.2.6 document对象 170
8.2.7 项目：打开新窗口 170
习题 172
第9章 DOM文档对象模型 175
9.1 认识DOM对象 176
9.2 HTML DOM Document对象 176
9.3 HTML DOM Event对象 181
9.4 HTML DOM Element对象 183
9.5 HTML DOM attribute对象 184
9.6 DOM与事件 185
9.6.1 事件绑定的方式 185
9.6.2 事件处理函数的执行顺序 187
9.6.3 事件冒泡和事件捕获 187
9.7 项目：诗词鉴赏 189
9.8 咖啡商城——购物车模块实现 192
9.8.1 项目说明 192
9.8.2 项目设计 193
9.8.3 项目实施 194
习题 195
第10章 Canvas画布 200
10.1 绘制基本图形 201
10.1.1 认识Canvas 201
10.1.2 Canvas的常用属性和方法 201
10.1.3 使用Canvas绘图对象绘制基本图形 202
10.1.4 项目：来自星星的它 209
10.2 绘制图像 213
10.2.1 使用Canvas绘图对象裁剪图像 213
10.2.2 项目：放大镜 216
10.2.3 项目：跳动的心 218
10.2.4 项目：鼠标画板 220
10.3 咖啡商城——商品详情模块实现 223
10.3.1 项目说明 223
10.3.2 项目设计 223
10.3.3 项目实施 224
习题 226
第11章 本地存储 229
11.1 Web Storage 230
11.1.1 Web Storage的常用属性和方法 230
11.1.2 项目：简易购物车 231
11.2 本地数据库 236
11.2.1 本地数据库访问 237
11.2.2 项目：简易留言本 239
11.3 咖啡商城——购物车本地存储模块实现 245
11.3.1 项目说明 245
11.3.2 项目设计 246
11.3.3 项目实施 247
习题 251
第12章 jQuery基础 253
12.1 jQuery的由来及简介 254
12.1.1 向页面添加jQuery库 254
12.1.2 项目：第一个jQuery程序 255
12.2 jQuery选择器 256
12.2.1 基本选择器 256
12.2.2 层次选择器 256
12.2.3 过滤选择器 257
12.2.4 表单元素选择器 259
12.3 jQuery常用方法 259
12.4 jQuery对象与DOM对象 263
12.5 jQuery事件 264
12.5.1 常见的DOM事件 264
12.5.2 事件绑定卐移除 267
12.6 jQuery动画 269
12.6.1 隐藏和显示 269
12.6.2 淡入和淡出 270
12.6.3 animate动画 270
12.7 咖啡商城——图片轮播 271
12.7.1 项目说明 271
12.7.2 项目设计 272
12.7.3 项目实施 272
12.8 JSON 273
12.8.1 JSON语法规则 273
12.8.2 常用类型 274
12.8.3 基础示例 274
12.9 Ajax 275
12.9.1 Ajax如何工作 275
12.9.2 jQuery中的Ajax 277
12.10 咖啡商城——查看商品详情 279
12.10.1 项目说明 279
12.10.2 项目设计 279
12.10.3 项目实施 280
习题 281
第13章 跨平台移动App开发 285
13.1 HTML5 Plus规范 286
13.2 HTML5＋App 286
13.3 HelloMUI示例 287
13.4 建立MUI项目 289
13.5 咖啡商城——移动App 291
13.5.1 项目说明 291
13.5.2 项目设计 292
13.5.3 项目实施 292
13.6 Hello H5＋示例 294
13.7 创建Hello H5＋项目 296
13.8 项目：语音答题App 301
13.8.1 项目说明 301
13.8.2 项目设计 302
13.8.3 项目实施 302
第14章 网站综合设计 305
14.1 项目构思 306
14.2 UI设计 309
14.3 网页制作 314
附录A 学习知识点及能力要点 324
A.1 教材的知识要点及掌握程度 324
A.2 教材的能力要点及重要程度 325
附录B RGB颜色对照表 326
附录C 部分习题参考答案 331
参考文献 335