HTML5+CSS3+JavaScript项目开发PDF电子书下载

咖啡商城项目导引 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