HTML5开发从入门到精通

适读人群 ：网站开发者 网页设计师 相关专业师生
　　这是一本围绕着当前应用广泛的网页开发技术HTML5编写的图书，书中不但深入浅出的讲解了HTML5相关技术，还配备了大量实战案例，帮助读者从零基础开始，快速掌握用HTML5开发网站设计网页的技能，本书还配备了全部源代码资源和免费电子教学PPT，以帮助读者用好本书。

　　HTML5是HTML技术的新版本，和以前的版本相比，HTML5的功能更加强大，并且支持移动Web应用。本书分为5篇，共计17章，包括：基础知识篇、核心技术篇、技术提高篇、实战演练篇和综合实战篇五大部分内容。在讲解每一个知识点时，都遵循了“理论结合实践”的教学模式，通过具体实例讲解了每一个知识点的具体用法。
　　本书适合网页设计人员、Web设计师、网站开发人员、网络维护人员的学习和参考，也可作为相关培训学校和大专院校相关专业的教学用书。

前言
第一篇 基础知识篇
第1章 网页设计技术基础 1
1.1 认识网页和网站 1
1.1.1 网页 1
1.1.2 网站 2
1.1.3 网站制作流程 3
1.1.4 网页设计流程 3
1.1.5 发布站点 4
1.2 Web标准布局介绍 4
1.2.1 当前的Web开发标准 4
1.2.2 为什么使用Web标准 5
1.2.3 CSS布局标准 6
1.3 常用的网页制作工具 7
1.3.1 Dreamweaver简介 7
1.3.2 安装Dreamweaver 9
1.4 HTML 5的新功能 13
1.5 初次体验HTML 5的魅力 13
第二篇 核心技术篇
第2章 HTML 5的整体架构 15
2.1 设置网页头部元素 15
2.1.1 设置文档类型 15
2.1.2 设置所有链接规定默认地址或默认目标 17
2.1.3 链接标签 17
2.1.4 设置有关页面的元信息 19
2.1.5 定义客户端脚本 20
2.1.6 定义HTML文档的样式信息 21
2.1.7 设置页面标题 22
2.2 设置页面正文 23
2.3 注释是一种说明 25
2.4 和页面结构相关的新元素 25
2.4.1 定义区段的标签 26
2.4.2 定义独立内容的标签 26
2.4.3 定义导航链接标签 27
2.4.4 定义其所处内容之外的内容 27
2.4.5 定义页脚内容的标签 28
第3章 体验基本元素 29
3.1 在页面中输出一段文字 29
3.2 对页面进行分栏设计 30
3.3 使用标记元素实现交互 32
3.3.1 常用属性 33
3.3.2 实现下拉弹出效果 34
3.4 使用标记元素实现交互 36
3.5 使用标记元素 37
3.5.1 属性介绍 37
3.5.2 实现右键菜单功能 39
3.6 使用标记元素 41
3.7 使用标记元素 44
3.8 使用标记元素 46
3.9 使用树节点标记元素 49
3.9.1 元素 49
3.9.2 元素 49
3.9.3 元素 49
3.10 使用分组标记元素 51
3.10.1

元素 51
3.10.2

元素 52
3.11 使用文本层次语义标记 53
3.11.1 元素 53
3.11.2 元素 54
3.11.3 元素 54
3.12 使用图片标记元素 55
3.13 使用框架标记元素 57
3.14 使用标记元素 58
第4章 使用表单元素 60
4.1 表单元素的类型 60
4.1.1 email类型 60
4.1.2 url类型 62
4.1.3 number类型 64
4.1.4 range类型 65
4.1.5 Date Pickers（数据检出器） 68
4.1.6 search类型 70
4.2 表单元素中的属性 72
4.2.1 记住表单中的数据 72
4.2.2 验证表单中输入的数据是否合法 74
4.2.3 在文本框中显示提示信息 75
4.2.4 验证文本框中的内容是否为空 77
4.2.5 开启表单的自动完成功能 78
4.2.6 重写表单中的某些属性 79
4.2.7 自动设置表单中传递数字 81
4.2.8 在表单中选择多个上传文件 82
4.3 新的表单元素 83
4.3.1 在表单中自动提示输入文本 83
4.3.2 一个简单的乘法计算器 85
4.3.3 在网页中生成一个密钥 86
第5章 音频和视频应用详解 88
5.1 处理视频 88
5.1.1 使用标记 88
5.1.2 标记的属性 89
5.2 处理音频 93
5.2.1 标记 93
5.2.2 标记的属性 94
5.3 高级应用 97
5.3.1 为播放的视频准备一幅素材图片 97
5.3.2 显示加载视频的状态 100
5.3.3 出错时在播放屏幕中显示出错信息 101
5.3.4 检测浏览器是否支持这个媒体类型 103
5.3.5 显示视频的播放状态 105
5.3.6 显示播放视频的时间信息 107
第6章 绘图应用详解 110
6.1 使用标记 110
6.2 HTML DOM Canvas对象 111
6.3 HTML 5绘图实践 113
6.3.1 在指定位置绘制指定角度的相交线 113
6.3.2 绘制一个圆 114
6.3.3 在画布中显示一幅指定的图片 115
6.3.4 绘制一个指定大小的正方形 116
6.3.5 绘制一个带边框的矩形 118
6.3.6 绘制一个渐变图形 119
6.3.7 绘制不同的圆形 121
6.3.8 绘制一个渐变圆形 125
6.3.9 移动、缩放和旋转网页中的正方形 127
6.3.10 使用组合的方式显示图形 129
6.3.11 使用不同的方式平铺指定的图像 131
6.3.12 切割指定的图像 133
6.3.13 绘制文字 135
6.3.14 制作一个简单的动画 137
第三篇 技术提高篇
第7章 数据存储应用详解 140
7.1 Web存储 140
7.1.1 什么是Web存储 140
7.1.2 Web存储的影响 140
7.2 HTML 5中的两种存储方法 141
7.2.1 使用localStorage方法 141
7.2.2 使用sessionStorage方法 142
7.3 数据存储对象 143
7.3.1 使用sessionStorage对象 143
7.3.2 使用localStorage对象 148
7.3.3 使用localStorage对象中的clear()方法 151
7.3.4 使用localStorage对象中的属性 153
7.4 WebDB存储方式 156
7.4.1 WebDB存储基础 156
7.4.2 执行事务操作 158
7.4.3 调用执行SQL语句 159
7.5 实现一个日记式事务提醒系统 162
7.6 使用sessionStorage来实现客户端的session功能 166
第8章 使用Web Sockets API 180
8.1 安装jWebSocket服务器 180
8.2 实现跨文档传输数据 181
8.3 使用WebSocket传送数据 185
8.3.1 使用Web Sockets API的方法 185
8.3.2 实战演练 186
8.4 处理JSON对象 188
8.5 jWebSocket框架 191
8.5.1 使用jWebSocketTest框架进行通信 192
8.5.2 使用jWebSocketTest开发一个聊天系统 196
第9章 使用Geolocation API 204
9.1 Geolocation API介绍 204
9.1.1 对浏览器的支持情况 204
9.1.2 使用API 205
9.2 获取当前地理位置 206
9.3 使用getCurrentPosition()方法 209
9.4 在网页中使用地图 211
9.4.1 在网页中调用地图 212
9.4.2 在地图中显示当前的位置 214
9.4.3 在网页中居中显示定位地图 216
9.4.4 利用百度地图实现定位处理 219
9.5 在弹出框中显示定位信息 221
第10章 使用Web Workers API 224
10.1 Web Workers API基础 224
10.1.1 使用HTML5 Web Workers API 224
10.1.2 需要使用.js文件 225
10.1.3 与Web Worker进行双向通信 225
10.2 Worker线程处理 227
10.2.1 使用Worker处理线程 228
10.2.2 使用线程传递JSON对象 231
10.2.3 使用线程嵌套交互数据 233
10.2.4 通过JSON发送消息 236
10.3 执行大计算量任务 238
10.4 在后台运行耗时较长的运算 245
第11章 在Android手机中使用HTML 5 249
11.1 搭建开发环境 249
11.1.1 搭建Android开发环境 249
11.1.2 搭建网页运行环境 251
11.2 先看一段代码 254
11.2.1 实现主页 254
11.2.2 编写CSS文件 255
11.2.3 实现页面自动缩放 258
11.3 添加Android的CSS 258
11.3.1 编写基本的样式 258
11.3.2 添加视觉效果 260
11.4 添加JavaScript 261
11.4.1 jQuery框架介绍 261
11.4.2 具体实践 263
11.5 使用Ajax 265
11.5.1 编写HTML文件 266
11.5.2 编写JavaScript文件 269
11.5.3 最后的修饰 270
11.6 让网页动起来 271
11.6.1 一个开源框架——jQTouch 272
11.6.2 一个简单应用 272
第四篇 实战演练篇
第12章 游戏实战 280
12.1 开发一个躲避小游戏 280
12.2 开发一个迷宫游戏 285
12.3 开发一个网页版的贪吃蛇游戏 290
12.4 开发一个网页版的俄罗斯方块游戏 294
12.5 开发一个网页版的抽奖游戏 305
第13章 统计图实战 310
13.1 使用插件RGraph制作柱状图 310
13.2 改变选中柱状图的颜色 311
13.3 在网页中绘制分组柱状图 314
13.4 将柱状图的同一根柱子设置为不同的颜色 316
13.5 在网页中绘制一个折线图 317
13.6 在网页中实现一个显示提示的折线图 319
13.7 在网页中绘制多根折线 322
13.8 绘制范围折线图 324
13.9 在一个折线图中使用左右两根不同单位的垂直坐标轴 325
13.10 在一个统计图中同时绘制柱状图与折线图 327
13.11 在HTML 5网页中绘制动态折线图 329
13.12 在HTML 5网页中绘制一个饼图 332
13.13 点击饼块后呈现白色半透明效果 333
13.14 在HTML 5网页中绘制横向柱状图 335
13.15 在网页中绘制分组横向柱状图 337
第14章 特效实战 339
14.1 实现星级评论功能 339
14.2 实现无刷新验证 342
14.3 使用jQuery实现的表单特效 345
14.4 在网页中动态操作表格 348
14.5 在文本框中实现层效果 351
14.6 实现五彩连珠网页特效 354
14.7 让网页中的图片div竖向滑动 368
14.8 实现滑动门特效 371
14.9 实现上下可拖动效果 374
14.10 在网页中实现粒子特效效果 377
第15章 Web设计中的典型模块 384
15.1 一个项目引发的问题 384
15.2 JavaScript特效的应用 385
15.3 文字处理 387
15.3.1 实例概述 387
15.3.2 定义文本颜色 388
15.3.3 指定文本内容 388
15.3.4 文本增亮处理 388
15.3.5 文本减亮处理 389
15.3.6 定义变换频率 389
15.4 时间处理模块 390
15.5 图像处理模块 392
15.5.1 实例概述 392
15.5.2 设置图像属性 393
15.5.3 亮度增加处理 393
15.5.4 亮度减小处理 394
15.6 背景处理 396
15.7 鼠标处理 397
15.7.1 实例概述 397
15.7.2 指定跟随文本 397
15.7.3 文本效果处理 398
15.7.4 页面显示 399
15.8 菜单处理 399
15.8.1 实例概述 400
15.8.2 设置菜单元素内容 400
15.8.3 设置滚动区域属性 400
第16章 文件操作实战 402
16.1 选择一个上传文件 402
16.2 选择多个上传文件 405
16.3 获取文件的类型和大小 406
16.4 过滤出非图片格式的文件 409
16.5 过滤上传文件的类型 410
16.6 预览上传的图片 412
16.7 读取某个文本文件的内容 414
16.8 监听事件 416
16.9 使用拖拽的方式上传图片 419
16.10 拖拽上传图片到表单并显示预览 421
16.11 IE浏览器支持的上传图片预览程序 424
16.12 使用拖拽的方式在相簿中对照片进行排序 426
第五篇 综合实战篇
第17章 使用HTML 5+CSS 3开发商业站点实例 430
17.1 CSS 3基础 430
17.1.1 CSS概述 430
17.1.2 基本语法 431
17.1.3 选择符的使用 432
17.1.4 CSS属性的简介 435
17.1.5 几个常用值 436
17.1.6 网页中的CSS应用 440
17.1.7 CSS的编码规范 443
17.1.8 CSS调试 445
17.2 开发一个商业站点 447
17.2.1 网站规划 447
17.2.2 站点需求分析 447
17.2.3 预期效果分析 448
17.2.4 站点结构规划 450
17.2.5 设计系统首页文件 450
17.2.6 设计产品展示页面 453
17.2.7 设计关于我们页面 455
17.2.8 设计CSS 3样式文件 457

　　HTML技术经过了很长的发展，版本不断更新，每一次更新都为网页设计工作带来了巨大的变化。HTML的上一个版本诞生于1999年，此后，Web世界已经经历了巨变。虽然HTML5仍处于完善之中，但是现在大部分的浏览器已经具备了支持某些HTML5新特性的功能。在2007年，HTML5被W3C所接受，正式成为网页设计标准。在当前市场应用中，HTML5将成为HTML、XHTML以及HTMLDOM的新标准。和之前的版本相比，HTML5的功能更加强大，并且支持移动Web应用。
　　本书的内容本书分5篇，共17章，循序渐进地讲解了HTML5技术的基本知识。本书从Web开发标准与网页网站制作介绍讲起，依次讲解了网页设计技术基础，HTML5的整体架构，体验基本元素，使用表单元素，音频和视频应用详解，绘图应用详解，数据存储应用详解，使用WebSocketsAPI，使用GeolocationAPI，使用WebWorkersAPI，在Android手机中使用HTML5，游戏实战，统计图实战，特效实战，Web设计中的典型模块，文件操作实战，使用HTML5+CSS3开发商业站点实例等知识。上述内容几乎涵盖了HTML5技术中的所有主要内容，全书内容言简意赅，讲解方法通俗易懂、详细，不但适合网页设计高手们学习，也特别有利于初学者学习并消化。
　　本书特色本书内容丰富，讲解细致，我们的目标是通过一本图书提供多本图书的价值，读者可以根据自己的需要有选择地阅读。在内容的编写上，本书具有以下特色：
　　（1）结构合理从用户的实际需要出发，科学安排知识结构，内容由浅入深，叙述清楚。
　　（2）遵循“理论加实践”这一主线为了使广大读者彻底弄清楚HTML5技术的精髓，在讲解每一个知识点时，通过具体地演示实例讲解了每一个知识点的具体用法。
　　（3）易学易懂本书内容条理清晰、语言简洁，可以帮助读者快速掌握每个知识点。使读者既可以按照本书编排的章节顺序进行学习，也可以根据自己的需要对某一章节进行针对性的学习。
　　（4）实用性强本书彻底摒弃枯燥的理论和简单的操作，注重实用性和可操作性，通过详实的语言和细腻的笔法，详细讲解了HTML5各个知识点的基本知识。
　　（5）内容全面本书可以称为“内容最全面的一本HTML5开发书”，无论是传统网页技术开发的知识点，还是数据存储、API等知识，甚至Android和iOS移动Web的开发知识，在本书中都有详细介绍。
　　读者对象初学网页设计的自学者网页设计师Web开发人员大中专院校的老师和学生毕业设计的学生移动Web设计人员相关培训机构的老师和学员从事移动Web开发的程序员本书主要由王石磊编写，参加编写的还有管西京、周秀、张余、李佐彬、王梦、王书鹏、唐凯、关立勋、张建敏、杨靖宇、谭贞军、杨絮、刘英田、高秀云、任杰、张子帝、黄河、孟娜、杨国华、王南荻、翟明、焦甜甜、张储、刘继虎。在编写过程中，得到了机械工业出版社有关人员的大力支持。正是各位编辑的求实、耐心和高效率的工作精神，才使本书在较短的时间内出版。另外要告知各位读者，本编写团队毕竟水平有限，书中纰漏和不尽如人意之处在所难免，诚请读者提出意见或建议，以便修订并使之更臻完善。
　　编者