第一部分 开篇 1
第1章 HTML5背景知识 1
1.1 HTML的历史 2
1.1.1 JavaScript出场 2
1.1.2浏览器战争的结束 3
1.1.3插件称雄 3
1.1.4语义HTML浮出水面 3
1.1.5发展态势:HTML标准滞后于其使用 4
1.2 HTML5简介 4
1.2.1新标准 4
1.2.2引入原生多媒体支持 5
1.2.3引入可编程内容 5
1.2.4引入语义Web 6
1.3 HTML5现况 6
1.3.1浏览器对HTML5的支持情况 6
1.3.2网站对HTML5的支持情况 6
1.4本书结构 6
1.5 HTML5的更多信息 7
1.6小结 7
第2章 准备工作 8
2.1挑选浏览器 8
2.2挑选HTML编辑器 9
2.3挑选Web服务器 9
2.4获取Node.js 9
2.5获取示例代码 10
2.6小结 10
第3章 初探HTML 11
3.1使用元素 12
3.1.1了解本章用到的元素 13
3.1.2使用空元素 14
3.1.3使用自闭合标签 14
3.1.4使用虚元素 14
3.2使用元素属性 16
3.2.1一个元素应用多个属性 16
3.2.2使用布尔属性 16
3.2.3使用自定义属性 17
3.3创建HTML文档 17
3.3.1外层结构 18
3.3.2元数据 19
3.3.3内容 19
3.3.4父元素、子元素、后代元素和兄弟元素 20
3.3.5了解元素类型 20
3.4使用HTML实体 21
3.5 HTML5全局属性 21
3.5.1 accesskey属性 21
3.5.2 class属性 22
3.5.3 contenteditable属性 25
3.5.4 contextmenu属性 25
3.5.5 dir属性 26
3.5.6 draggable属性 26
3.5.7 dropzone属性 26
3.5.8 hidden属性 26
3.5.9 id属性 28
3.5.10 lang属性 29
3.5.11 spellcheck属性 29
3.5.12 style属性 30
3.5.13 tabindex属性 30
3.5.14 title属性 31
3.6有用的HTML工具 32
3.7小结 32
第4章 初探CSS 33
4.1定义和应用样式 33
4.1.1了解本章所用的CSS属性 34
4.1.2使用元素内嵌样式 34
4.1.3使用文档内嵌样式 35
4.1.4使用外部样式表 37
4.2样式的层叠和继承 40
4.2.1浏览器样式 40
4.2.2用户样式 41
4.2.3样式如何层叠 42
4.2.4用重要样式调整层叠次序 42
4.2.5根据具体程度和定义次序解决同级样式冲突 43
4.2.6继承 46
4.3 CSS中的颜色 48
4.4 CSS中的长度 49
4.4.1绝对长度 50
4.4.2相对长度 51
4.5其他CSS单位 56
4.5.1使用CSS角度 56
4.5.2使用CSS时间 57
4.6测试CSS特性的支持情况 57
4.7有用的CSS工具 57
4.7.1浏览器样式报告 57
4.7.2用SelectorGadget生成选择器 58
4.7.3用LESS改进CSS 59
4.7.4使用CSS框架 59
4.8小结 59
第5章 初探JavaScript 60
5.1准备使用JavaScript 61
5.2使用语句 62
5.3定义和使用函数 63
5.3.1定义带参数的函数 63
5.3.2定义会返回结果的函数 64
5.4使用变量和类型 65
5.4.1使用基本类型 66
5.4.2创建对象 67
5.4.3使用对象 69
5.5使用JavaScript运算符 73
5.5.1相等和等同运算符 73
5.5.2显式类型转换 76
5.6使用数组 78
5.6.1使用数组字面量 79
5.6.2读取和修改数组内容 80
5.6.3枚举数组内容 80
5.6.4使用内置的数组方法 81
5.7处理错误 81
5.8比较undefined和null值 83
5.8.1检查变量或属性是否为undefined或null 85
5.8.2区分null和undefined 85
5.9常用的JavaScript工具 86
5.9.1使用JavaScript调试器 86
5.9.2使用JavaScript库 86
5.10小结 87
第二部分 HTML元素 90
第6章 HTML5元素背景知识 90
6.1语义与呈现分离 90
6.2元素选用原则 91
6.2.1少亦可为多 91
6.2.2别误用元素 91
6.2.3具体为佳,一以贯之 91
6.2.4对用户不要想当然 92
6.3元素说明体例 92
6.4元素速览 92
6.4.1文档和元数据元素 92
6.4.2文本元素 93
6.4.3对内容分组 94
6.4.4划分内容 95
6.4.5制表 95
6.4.6创建表单 96
6.4.7嵌入内容 96
6.5未实现的元素 97
6.6小结 97
第7章 创建HTML文档 98
7.1构筑基本的文档结构 99
7.1.1 DOCTYPE元素 99
7.1.2 html元素 99
7.1.3 head元素 100
7.1.4 body元素 101
7.2用元数据元素说明文档 102
7.2.1设置文档标题 102
7.2.2设置相对URL的解析基准 103
7.2.3用元数据说明文档 104
7.2.4定义CSS样式 108
7.2.5指定外部资源 112
7.3使用脚本元素 116
7.3.1 script元素 117
7.3.2 noscript元素 123
7.4小结 125
第8章 标记文字 126
8.1生成超链接 127
8.1.1生成指向外部的超链接 128
8.1.2使用相对URL 129
8.1.3生成内部超链接 129
8.1.4设定浏览环境 130
8.2用基本的文字元素标记内容 131
8.2.1表示关键词和产品名称 131
8.2.2加以强调 132
8.2.3表示外文词语或科技术语 133
8.2.4表示不准确或校正 134
8.2.5表示重要的文字 135
8.2.6为文字添加下划线 136
8.2.7添加小号字体内容 137
8.2.8添加上标和下标 138
8.3换行 139
8.3.1强制换行 139
8.3.2指明可以安全换行的建议位置 141
8.4表示输入和输出 142
8.5使用标题引用、引文、定义和缩写 143
8.5.1表示缩写 143
8.5.2定义术语 144
8.5.3引用来自他处的内容 145
8.5.4引用其他作品的标题 146
8.6使用语言元素 147
8.6.1 ruby、rt和rp元素 147
8.6.2 bdo元素 149
8.6.3 bdi元素 150
8.7其他文本元素 152
8.7.1表示一段一般性的内容 152
8.7.2突出显示文本 153
8.7.3表示添加和删除的内容 155
8.7.4表示时间和日期 156
8.8小结 157
第9章 组织内容 158
9.1为什么要对内容分组 158
9.2建立段落 159
9.3使用div元素 161
9.4使用预先编排好格式的内容 163
9.5引用他处内容 164
9.6添加主题分隔 166
9.7将内容组织为列表 169
9.7.1 ol元素 169
9.7.2 ul元素 171
9.7.3 li元素 172
9.7.4生成说明列表 173
9.7.5生成自定义列表 174
9.8使用插图 176
9.9小结 178
第10章 文档分节 179
10.1添加基本的标题 179
10.2隐藏子标题 182
10.3生成节 185
10.4添加首部和尾部 188
10.5添加导航区域 191
10.6使用article 194
10.7生成附注栏 198
10.8提供联系信息 201
10.9生成详情区域 202
10.10小结 205
第11章 表格元素 206
11.1生成基本的表格 206
11.2添加表头单元格 209
11.3为表格添加结构 211
11.3.1表示表头和表格主题 212
11.3.2添加表脚 214
11.4制作不规则表格 216
11.5把表头与单元格关联起来 220
11.6为表格添加标题 221
11.7处理列 223
11.8设置表格边框 228
11.9小结 230
第12章 表单 231
12.1制作基本表单 232
12.1.1定义表单 233
12.1.2查看表单数据 234
12.2配置表单 236
12.2.1配置表单的action属性 236
12.2.2配置HTTP方法属性 237
12.2.3配置数据编码 237
12.2.4控制表单的自动完成功能 239
12.2.5指定表单反馈信息的目标显示位置 240
12.2.6设置表单名称 242
12.3在表单中添加说明标签 242
12.4自动聚焦到某个input元素 244
12.5禁用单个input元素 245
12.6对表单元素编组 246
12.6.1为fieldset元素添加说明标签 248
12.6.2用fieldset禁用整组input元素 249
12.7使用button元素 250
12.7.1用button元素提交表单 251
12.7.2用button元素重置表单 252
12.7.3把button作为一般元素使用 253
12.8使用表单外的元素 254
12.9小结 254
第13章 定制input元素 255
13.1用input元素输入文字 256
13.1.1设定元素大小 256
13.1.2设置初始值和占位式提示 258
13.1.3使用数据列表 259
13.1.4生成只读或被禁用的文本框 262
13.1.5指定文字方向数据的名称 263
13.2用input元素输入密码 263
13.3用input元素生成按钮 266
13.4用input元素为输入数据把关 267
13.4.1用input元素获取数值 268
13.4.2用input元素获取指定范围内的数值 270
13.4.3用input元素获取布尔型输入 271
13.4.4用input元素生成一组固定选项 273
13.4.5用input元素获取有规定格式的字符串 275
13.4.6用input元素获取时间和日期 277
13.4.7用input元素获取颜色值 279
13.5用input元素获取搜索用词 281
13.6用input元素生成隐藏的数据项 282
13.7用input元素生成图像按钮和分区响应图 284
13.8用input元素上传文件 286
13.9小结 288
第14章 其他表单元素及输入验证 289
14.1使用其他表单元素 289
14.1.1生成选项列表 289
14.1.2输入多行文字 294
14.1.3表示计算结果 296
14.1.4生成公开/私有密钥对 297
14.2使用输入验证 298
14.2.1确保用户提供了一个值 299
14.2.2确保输入值位于某个范围内 300
14.2.3确保输入值与指定模式匹配 301
14.2.4确保输入值是电子邮箱地址或URL 303
14.3禁用输入验证 304
14.4小结 305
第15章 嵌入内容 306
15.1嵌入图像 306
15.1.1在超链接里嵌入图像 308
15.1.2创建客户端分区响应图 310
15.2嵌入另一张HTML文档 313
15.3通过插件嵌入内容 315
15.3.1使用embed元素 315
15.3.2使用object和param元素 317
15.4 object元素的其他用途 319
15.4.1使用object元素嵌入图像 319
15.4.2使用object元素创建分区响应图 320
15.4.3将object元素作为浏览上下文环境 320
15.5嵌入数字表现形式 321
15.5.1显示进度 321
15.5.2显示范围里的值 322
15.6其他嵌入元素 324
15.6.1嵌入音频和视频 324
15.6.2嵌入图形 324
15.7小结 324
第三部分 CSS 326
第16章 理解CSS 326
16.1 CSS标准化 326
16.2盒模型 327
16.3选择器简明参考 328
16.4属性简明参考 329
16.4.1边框和背景属性 329
16.4.2盒模型属性 331
16.4.3布局属性 332
16.4.4文本属性 332
16.4.5过渡、动画和变换属性 333
16.4.6其他属性 334
16.5小结 334
第17章 使用CSS选择器(第Ⅰ部分) 335
17.1使用CSS基本选择器 335
17.1.1选择所有元素 336
17.1.2根据类型选择元素 337
17.1.3根据类选择元素 338
17.1.4根据ID选择元素 340
17.1.5根据属性选择元素 341
17.2复合选择器 344
17.2.1并集选择器 344
17.2.2后代选择器 345
17.2.3选择子元素 347
17.2.4选择兄弟元素 349
17.3使用伪元素选择器 351
17.3.1使用::first-line选择器 351
17.3.2使用::first-letter选择器 352
17.3.3使用:before和:after选择器 353
17.3.4使用CSS计数器 354
17.4小结 356
第18章 使用CSS选择器(第Ⅱ部分) 357
18.1使用结构性伪类选择器 357
18.1.1使用根元素选择器 358
18.1.2使用子元素选择器 359
18.1.3使用:nth-child选择器 363
18.2使用UI伪类选择器 364
18.2.1选择启用或禁用元素 364
18.2.2选择已勾选的元素 365
18.2.3选择默认元素 366
18.2.4选择有效和无效的input元素 367
18.2.5选择限定范围的input元素 369
18.2.6选择必需和可选的input元素 370
18.3使用动态伪类选择器 371
18.3.1使用:link和:visited选择器 371
18.3.2使用:hover选择器 372
18.3.3使用:active选择器 373
18.3.4使用:focus选择器 374
18.4其他伪类选择器 375
18.4.1使用否定选择器 376
18.4.2使用:empty选择器 376
18.4.3使用:lang选择器 377
18.4.4使用:target选择器 377
18.5小结 379
第19章 使用边框和背景 380
19.1应用边框样式 380
19.1.1定义边框宽度 381
19.1.2定义边框样式 382
19.1.3为一条边应用边框样式 383
19.1.4使用border简写属性 384
19.1.5创建圆角边框 385
19.1.6将图像用做边框 388
19.2设置元素的背景 392
19.2.1设置背景颜色和图像 392
19.2.2设置背景图像的尺寸 394
19.2.3设置背景图像位置 395
19.2.4设置元素的背景附着方式 396
19.2.5设置背景图像的开始位置和裁剪样式 397
19.2.6使用background简写属性 399
19.3创建盒子阴影 400
19.4应用轮廓 403
19.5小结 405
第20章 使用盒模型 406
20.1为元素应用内边距 407
20.2为元素应用外边距 409
20.3控制元素的尺寸 410
20.3.1设置一定尺寸的盒子 412
20.3.2设置最小和最大尺寸 413
20.4处理溢出内容 414
20.5控制元素的可见性 417
20.6设置元素的盒类型 419
20.6.1认识块级元素 420
20.6.2认识行内元素 421
20.6.3认识行内-块级元素 422
20.6.4认识插入元素 423
20.6.5隐藏元素 426
20.7创建浮动盒 427
20.8小结 433
第21章 创建布局 434
21.1定位内容 434
21.1.1设置定位类型 435
21.1.2设置元素的层叠顺序 437
21.2创建多列布局 439
21.3创建弹性盒布局 442
21.3.1创建简单的弹性盒 444
21.3.2伸缩多个元素 446
21.3.3处理垂直空间 447
21.3.4处理最大尺寸 448
21.4创建表格布局 450
21.5小结 453
第22章 设置文本样式 454
22.1应用基本文本样式 454
22.1.1对齐文本 455
22.1.2处理空白 457
22.1.3指定文本方向 460
22.1.4指定单词、字母、行之间的间距 461
22.1.5控制断词 462
22.1.6首行缩进 464
22.2文本装饰与大小写转换 465
22.3创建文本阴影 467
22.4使用字体 468
22.4.1选择字体 469
22.4.2设置字体大小 470
22.4.3设置字体样式和粗细 472
22.5使用Web字体 473
22.6小结 475
第23章 过渡、动画和变换 476
23.1使用过渡 477
23.1.1创建反向过渡 480
23.1.2选择中间值的计算方式 481
23.2使用动画 483
23.2.1使用关键帧 486
23.2.2设置重复方向 488
23.2.3理解结束状态 490
23.2.4初始布局时应用动画 491
23.2.5重用关键帧 492
23.2.6为多个元素应用多个动画 493
23.2.7停止和启动动画 495
23.3使用变换 497
23.3.1应用变换 497
23.3.2指定元素变换的起点 498
23.3.3将变换作为动画和过渡处理 500
23.4小结 501
第24章 其他CSS属性和特性 502
24.1设置元素的颜色和透明度 502
24.1.1设置前景色 502
24.1.2设置元素的透明度 504
24.2设置表格样式 505
24.2.1合并表格边框 505
24.2.2配置独立边框 507
24.2.3处理空单元格 508
24.2.4设置标题的位置 509
24.2.5指定表格布局 511
24.3设置列表样式 512
24.3.1设置列表标记类型 513
24.3.2使用图像作为列表标记 514
24.3.3设置列表标记的位置 515
24.4设置光标样式 517
24.5小结 518
第四部分 使用DOM 520
第25章 理解DOM 520
25.1理解文档对象模型 520
25.2理解DOM Level和兼容性 522
25.3 DOM快速查询 524
25.3.1 Document的成员 524
25.3.2 Window的成员 525
25.3.3 HTMLElement的成员 527
25.3.4 DOM里的CSS属性 529
25.3.5 DOM中的事件 531
25.4小结 532
第26章 使用Document对象 533
26.1使用Document元数据 536
26.1.1获取文档信息 536
26.1.2使用Location对象 537
26.1.3读取和写入cookie 541
26.1.4理解就绪状态 542
26.1.5获取DOM的实现情况 543
26.2获取HTML元素对象 544
26.2.1使用属性获取元素对象 545
26.2.2使用数组标记获取已命名元素 546
26.2.3搜索元素 548
26.2.4合并进行链式搜索 550
26.3在DOM树里导航 552
26.4小结 554
第27章 使用Window对象 555
27.1获取Window对象 555
27.2获取窗口信息 556
27.3与窗口进行交互 558
27.4对用户进行提示 559
27.5获取基本信息 561
27.6使用浏览器历史 561
27.6.1在浏览历史中导航 562
27.6.2在浏览历史里插入条目 564
27.6.3为不同的文档添加条目 566
27.6.4在浏览历史中保存复杂状态 567
27.6.5替换浏览历史中的条目 570
27.7使用跨文档消息传递 570
27.8使用计时器 574
27.9小结 576
第28章 使用DOM元素 577
28.1使用元素对象 577
28.1.1使用类 579
28.1.2使用元素属性 582
28.2使用Text对象 586
28.3修改模型 588
28.3.1创建和删除元素 589
28.3.2复制元素 591
28.3.3移动元素 592
28.3.4比较元素对象 593
28.3.5使用HTML片段 595
28.3.6向文本块插入元素 600
28.4小结 601
第29章为DOM元素设置样式 602
29.1使用样式表 602
29.1.1获得样式表的基本信息 603
29.1.2使用媒介限制 605
29.1.3禁用样式表 607
29.1.4 cSSRuleList对象的成员 608
29.2使用元素样式 611
29.3使用cSSStyleDeclaration对象 613
29.3.1使用便捷属性 613
29.3.2使用常规属性 616
29.3.3使用细粒度的CSS DOM对象 620
29.4使用计算样式 623
29.5小结 625
第30章 使用事件 626
30.1使用简单事件处理器 627
30.1.1实现简单的内联事件处理器 627
30.1.2实现一个简单的事件处理函数 629
30.2使用DOM和事件对象 630
30.2.1按类型区分事件 633
30.2.2理解事件流 634
30.2.3使用可撤销事件 641
30.3使用HTML事件 642
30.3.1文档和窗口事件 642
30.3.2使用鼠标事件 643
30.3.3使用键盘焦点事件 645
30.3.4使用键盘事件 647
30.3.5使用表单事件 649
30.4小结 649
第31章 使用元素专属对象 650
31.1文档和元数据对象 650
31.1.1 base元素 650
31.1.2 body元素 650
31.1.3 link元素 651
31.1.4 meta元素 651
31.1.5 script元素 651
31.1.6 style元素 652
31.1.7 title元素 652
31.1.8其他文档和元数据元素 652
31.2文本元素 652
31.2.1 a元素 652
31.2.2 del和ins元素 653
31.2.3 q元素 653
31.2.4 time元素 653
31.2.5其他文本元素 654
31.3分组元素 654
31.3.1 blockquote元素 654
31.3.2 li元素 654
31.3.3 ol元素 654
31.3.4其他分组元素 655
31.4区块元素 655
31.4.1 details元素 655
31.4.2其他区块元素 655
31.5表格元素 655
31.5.1 col和colgroup元素 655
31.5.2 table元素 656
31.5.3 thead、tbody和tfoot元素 656
31.5.4 th元素 657
31.5.5 tr元素 657
31.5.6其他表格元素 657
31.6表单元素 657
31.6.1 button元素 657
31.6.2 datalist元素 658
31.6.3 fieldset元素 658
31.6.4 form元素 658
31.6.5 input元素 659
31.6.6 label元素 660
31.6.7 legend元素 661
31.6.8 optgroup元素 661
31.6.9 option元素 661
31.6.10 output元素 661
31.6.11 select元素 662
31.6.12 textarea元素 663
31.7内容元素 663
31.7.1 area元素 664
31.7.2 embed元素 664
31.7.3 iframe元素 664
31.7.4 img元素 665
31.7.5 map元素 665
31.7.6 meter元素 665
31.7.7 object元素 666
31.7.8 param元素 666
31.7.9 progress元素 667
31.8小结 667
第五部分 高级功能 670
第32章 使用Ajax(第Ⅰ部分) 670
32.1 Ajax起步 671
32.1.1处理响应 674
32.1.2主流中的异类:应对Opera 675
32.2使用Ajax事件 677
32.3处理错误 679
32.3.1处理设置错误 681
32.3.2处理请求错误 682
32.3.3处理应用程序错误 682
32.4获取和设置标头 683
32.4.1覆盖请求的HTTP方法 683
32.4.2禁用内容缓存 685
32.4.3读取响应标头 685
32.5生成跨源Ajax请求 687
32.5.1使用Origin请求标头 690
32.5.2高级CORS功能 691
32.6中止请求 691
32.7小结 693
第33章 使用Ajax(第Ⅱ部分) 694
33.1准备向服务器发送数据 694
33.1.1定义服务器 695
33.1.2理解问题所在 697
33.2发送表单数据 698
33.3使用FormData对象发送表单数据 701
33.3.1创建FormData对象 701
33.3.2修改FormData对象 702
33.4发送JSON数据 703
33.5发送文件 705
33.6追踪上传进度 707
33.7请求并处理不同内容类型 709
33.7.1接收HTML片段 709
33.7.2接收XML数据 712
33.7.3接收JSON数据 714
33.8小结 715
第34章 使用多媒体 716
34.1使用video元素 717
34.1.1预先加载视频 718
34.1.2显示占位图像 720
34.1.3设置视频尺寸 720
34.1.4指定视频来源(和格式) 721
34.1.5 track元素 724
34.2使用audio元素 724
34.3通过DOM操作嵌入式媒体 726
34.3.1获得媒体信息 726
34.3.2评估回放能力 728
34.3.3控制媒体回放 730
34.4小结 733
第35章 使用canvas元素(第Ⅰ部分) 734
35.1开始使用canvas元素 735
35.2获取画布的上下文 736
35.3绘制矩形 737
35.4设置画布绘制状态 739
35.4.1设置线条连接样式 741
35.4.2设置填充和笔触样式 742
35.4.3使用渐变 743
35.4.4使用径向渐变 748
35.4.5使用图案 751
35.5保存和恢复绘制状态 753
35.6绘制图像 755
35.6.1使用视频图像 756
35.6.2使用画布图像 759
35.7小结 761
第36章 使用canvas元素(第Ⅱ部分) 762
36.1用路径绘图 762
36.1.1用线条绘制路径 763
36.1.2绘制矩形 766
36.2绘制圆弧 768
36.2.1使用arcTo方法 768
36.2.2使用arc方法 772
36.3绘制贝塞尔曲线 773
36.3.1绘制三次贝塞尔曲线 773
36.3.2绘制二次贝塞尔曲线 775
36.4创建剪辑区域 777
36.5绘制文本 778
36.6使用特效和变换 780
36.6.1使用阴影 780
36.6.2使用透明度 781
36.6.3使用合成 782
36.6.4使用变换 784
36.7小结 786
第37章 使用拖放 787
37.1创建来源项目 787
37.2创建释放区 791
37.3使用DataTransfer对象 794
37.3.1根据数据过滤被拖动项目 796
37.3.2拖放文件 797
37.4小结 801
第38章 使用地理定位 802
38.1使用地理定位 802
38.2处理地理定位错误 805
38.3指定地理定位选项 807
38.4监控位置 809
38.5小结 810
第39章 使用Web存储 811
39.1使用本地存储 811
39.2使用会话存储 815
39.3小结 819
第40章 创建离线Web应用程序 820
40.1定义问题 820
40.2定义清单 822
40.3检测浏览器状态 827
40.4使用离线缓存 828
40.4.1制作更新 832
40.4.2获取更新 832
40.4.3应用更新 833
40.5小结 834