HTML 5与CSS 3权威指南 上PDF电子书下载

上册 1

第1章 Web时代的变迁 1

1.1迎接新的Web时代 1

1.1.1 HTML 5时代即将来临 1

1.1.2 HTML 5的目标 3

1.1.3 HTML5的小版本更新 4

1.2 HTML 5深受欢迎的理由 4

1.2.1世界知名浏览器厂商对HTML5的支持 4

1.2.2第一个理由：时代的要求 5

1.2.3第二个理由：Internet Explorer 8 5

1.3可以放心使用HTML 5的三个理由 6

1.4 HTML 5要解决的三个问题 7

第2章 HTML5与HTML4的区别 8

2.1语法的改变 8

2.1.1 HTML 5的语法变化 8

2.1.2 HTML 5中的标记方法 9

2.1.3 HTML 5确保的兼容性 10

2.1.4标记示例 11

2.2新增的元素和废除的元素 12

2.2.1新增的结构元素 12

2.2.2新增的其他元素 14

2.2.3新增的input元素的类型 18

2.2.4废除的元素 18

2.3新增的属性和废除的属性 19

2.3.1新增的属性 19

2.3.2废除的属性 21

2.4全局属性 23

2.4.1 contentEditable属性 23

2.4.2 designMode属性 24

2.4.3 hidden属性 24

2.4.4 spellcheck属性 25

2.4.5 tabindex属性 25

2.5新增的事件 25

2.6只监听一次事件 26

第3章 HTML 5的结构 28

3.1新增的主体结构元素 28

3.1.1 article元素 29

3.1.2 section元素 31

3.1.3 nav元素 33

3.1.4 aside元素 34

3.1.5 time元素与微格式 36

3.1.6 pubdate属性 37

3.2新增的非主体结构元素 38

3.2.1 header元素 38

3.2.2 footer元素 39

3.2.3 address元素 40

3.2.4 main元素 41

3.3 HTML 5中网页结构 42

3.3.1 HTML 5中的大纲 42

3.3.2大纲的编排规则 48

3.3.3对新的结构元素使用样式 51

第4章 表单及其他新增和改良元素 53

4.1新增元素与属性 53

4.1.1新增属性 53

4.1.2大幅度地增加与改良input元素的种类 65

4.1.3对新的表单元素使用样式 77

4.1.4 output元素的追加 77

4.2表单验证 78

4.2.1自动验证 78

4.2.2取消验证 79

4.2.3显式验证 79

4.3增强的页面元素 80

4.3.1新增的figure元素与figcaption元素 80

4.3.2新增的details元素与summa元素 82

4.3.3新增的mark元素 83

4.3.4新增的progress元素 86

4.3.5新增的meter元素 87

4.3.6新增的dialog元素 88

4.3.7改良的a元素 90

4.3.8改良的ol列表 91

4.3.9改良的dl列表 92

4.3.10加以严格限制的cite元素 93

4.3.11重新定义的small元素 94

4.3.12安全性增强的inpame元素 94

4.3.13增强的script元素 97

第5章 ECMAScript中的新增功能 102

5.1新增语法 103

5.1.1使用for-of循环 103

5.1.2使用let关键字与const关键字声明变量 104

5.1.3使用class关键字声明类 109

5.1.4不确定参数及默认参数值 116

5.1.5箭头函数 121

5.1.6生成器函数 126

5.1.7解构赋值 129

5.1.8模板字符串 138

5.1.9在客户端使用JavaScript模块 141

5.2新增对象及数据类型 145

5.2.1 Promise对象 145

5.2.2全局唯一标识符：symbol 166

5.2.3代理与反射 170

5.2.4新增的各种集合对象 176

5.3对现有对象的扩展 187

第6章 文件API 194

6.1 FileList对象与file对象 195

6.2 ArrayBuffer对象与ArrayBuffer-View对象 196

6.2.1基本概念 196

6.2.2 ArrayBuffer对象 196

6.2.3 ArrayBufferView对象 196

6.2.4 DataView对象 198

6.3 Blob对象 202

6.3.1 Blob对象概述 202

6.3.2创建Blob对象 204

6.3.3 Blob对象的slice方法 207

6.4 FileReader对象 208

6.4.1 FileReader对象的方法 208

6.4.2 FileReader对象的事件 209

6.4.3 FileReader对象的使用示例 209

第7章 本地存储 217

7.1 Web Storage 218

7.1.1 Web Storage是什么 218

7.1.2简单Web留言本 221

7.1.3作为简易数据库来利用 224

7.1.4利用storage事件实时监视Web Storage中的数据 226

7.2 indexedDB数据库 229

7.2.1本地数据库的基本概念 229

7.2.2 indexedDB数据库的基本概念 229

7.2.3连接数据库 229

7.2.4数据库的版本更新 231

7.2.5创建对象仓库 233

7.2.6创建索引 236

7.2.7索引的multiEntry属性值 239

7.2.8使用事务 239

7.2.9保存数据 241

7.2.10在indexedDB数据库中保存Blob对象 244

7.2.11获取数据 247

7.2.12根据主键值检索数据 251

7.2.13根据搜索范围获取数据的主键值 257

7.2.14根据索引属性值检索数据 260

7.2.15 获取所有数据 266

7.2.16复合索引 272

7.2.17统计对象仓库中的数据数量 276

7.2.18列举数据库中所有对象仓库的名称 278

7.2.19列举事务中所有可访问对象仓库名称 279

7.2.20删除对象仓库 281

7.2.21根据主键删除单条数据 282

7.2.22列举对象仓库的所有索引名称及删除索引 286

7.2.23使用索引对象的方法 289

7.2.24在指定范围中抽取数据主键 298

7.2.25使用游标对象的方法 301

第8章 扩展的XMLHttpRequestAPI及FetchAPI 307

8.1从服务器端获取二进制数据 307

8.1.1 ArrayBuffer响应 308

8.1.2 Blob响应 313

8.2发送数据 314

8.2.1发送字符串 315

8.2.2发送表单数据 316

8.2.3上传文件 319

8.2.4发送Blob对象 320

8.2.5发送ArrayBuffer对象 323

8.3跨域数据请求 327

8.4使用Fetch API 328

8.4.1告别XMLHttpRequest 328

8.4.2使用Fetch API发出请求 329

8.4.3向服务器端发送POST请求 332

8.4.4提交JSON数据 333

8.4.5发送表单数据 334

8.4.6上传文件 335

8.4.7提交及下载Blob对象或ArrayBuffer对象 336

第9章 使用Web Workers处理线程 339

9.1基础知识 340

9.2与线程进行数据的交互 343

9.3线程嵌套 345

9.3.1单层嵌套 345

9.3.2在多个子线程中进行数据的交互 348

9.4线程中可用的变量、函数与类 349

9.5适用场合 350

9.6 SharedWorker 350

9.6.1基础知识 350

9.6.2实现前台页面与后台线程之间的通信 351

9.6.3定义页面与共享的后台线程开始通信时的处理 351

9.6.4 SharedWorker的使用示例 352

第10章 使用Service Worker实现离线应用程序 358

10.1 Service Worker的基本概念 358

10.2注册、下载及安装 359

10.3自定义请求的响应 365

10.4激活 372

10.5其他用例 375

第11章 通信API 376

11.1跨文档消息传输 377

11.1.1跨文档消息传输的基本知识 377

11.1.2跨文档消息传输示例 377

11.1.3通道通信 379

11.2 WebSockets通信 384

11.2.1 WebSockets通信的基本知识 384

11.2.2使用WebSockets API 384

11.2.3 WebSockets API使用示例 385

11.2.4发送对象 387

11.2.5发送与接收原始二进制数据 388

11.2.6实现WebSockets API的开发框架 389

11.2.7 WebSocket协议 390

11.2.8 WebSockets API的适用场景 390

11.3 Server-Sent Events API 390

11.3.1 Server-Sent Events API的基本概念 390

11.3.2 Server-Sent Events API的实现方法 391

11.4 BroadcastChannel API 398

11.4.1 BroadcastChannel API的基本概念 398

11.4.2与其他技术的区别 400

第12章 Web组件 402

12.1使用template元素定制客户端模板 403

12.1.1特性检测 403

12.1.2定义模板内容 403

12.1.3动态设置模板内容 406

12.1.4模板中嵌套模板 406

12.2自身独立的Shadow DOM组件 409

12.2.1 Shadow DOM的基本概念 410

12.2.2创建Shadow DOM 410

12.2.3实现内容与展示的分离 412

12.2.4对Shadow DOM使用样式 423

12.2.5高级主题 430

12.3自定义元素 432

12.3.1自定义元素的基本概念 432

12.3.2自定义全新的HTML元素 432

12.3.3扩展元素 436

12.3.4在JavaScript脚本代码中创建自定义元素 439

12.3.5自定义元素响应 440

12.3.6自定义元素的属性 446

12.3.7指定自定义元素的内容 451

12.3.8指定自定义元素的样式 454

12.4 HTML导入 456

12.4.1 HTML导入所能解决的课题 456

12.4.2 HTML导入的基本概念 456

12.4.3打包资源 457

12.4.4 load事件与error事件 457

12.4.5使用被导入文档 459

12.4.6传输Web组件 462

12.4.7管理依赖和子导入 464

12.4.8性能注意事项 468

12.4.9 HTML导入的要点 468

12.4.10 HTML导入的使用案例 469

第13章 绘制图形 470

13.1 canvas元素的基础知识 470

13.1.1在页面中放置canvas元素 471

13.1.2绘制矩形 471

13.2使用路径 473

13.2.1绘制圆形 473

13.2.2不关闭路径会怎么样 476

13.2.3绘制直线 477

13.2.4绘制曲线 482

13.2.5使用Path2D对象绘制路径 484

13.3绘制渐变图形 487

13.3.1绘制线性渐变 487

13.3.2绘制径向渐变 489

13.4绘制变形图形 490

13.4.1坐标变换 490

13.4.2坐标变换与路径的结合使用 492

13.4.3矩阵变换 493

13.5给图形绘制阴影 497

13.6使用图像 498

13.6.1绘制图像 498

13.6.2图像平铺 501

13.6.3图像裁剪 503

13.6.4像素处理 505

13.7图形、图像的组合与混合 506

13.7.1组合图形 506

13.7.2混合图像 508

13.8绘制文字 511

13.9补充知识 513

13.9.1保存与恢复状态 513

13.9.2将canvas元素中的图像转换为data URL 514

13.9.3将canvas元素中的图像转换为Blob对象 515

13.9.4简单动画的制作 518

13.9.5解码图像 521

第14章 多媒体相关API 523

14.1 video元素与audio元素的基础知识 524

14.2属性 526

14.3方法 530

14.4事件 533

下册 1

第15章CSS 3概述 1

15.1概要介绍 1

15.1.1 CSS 3是什么 1

15.1.2 CSS 3的历史 2

15.2使用CSS 3能做什么 2

15.2.1模块与模块化结构 2

15.2.2一个简单的CSS 3示例 4

第16章 选择器 7

16.1选择器概述 8

16.2属性选择器 9

16.2.1属性选择器概述 9

16.2.2 CSS 3中的属性选择器 11

16.2.3灵活运用属性选择器 12

16.3结构性伪类选择器 13

16.3.1 CSS中的伪类选择器及伪元素 13

16.3.2选择器root、not、emp和target 18

16.3.3选择器first-child、last-child、nth-child和nth-last-child 22

16.3.4选择器nth-of-type和nth-last-of-type 27

16.3.5循环使用样式 30

16.3.6 only-child选择器 32

16.4.UI元素状态伪类选择器 33

16.4.1伪类选择器E：hover、E：active和E：focus 34

16.4.2伪类选择器E：enabled与E：disabled 36

16.4.3伪类选择器E：read-only与E：read-write 37

16.4.4伪类选择器E：checked、E：default和E：indeterminate 38

16.4.5伪类选择器E：：selection 41

16.4.6伪类选择器E：invalid与E：valid 43

16.4.7伪类选择器E：required与E：optional 44

16.4.8伪类选择器E：in-range与E：out-of-range 44

16.5通用兄弟元素选择器 45

第17章 使用选择器在页面中插入内容 47

17.1使用选择器来插入文字 47

17.1.1使用选择器来插入内容 47

17.1.2指定个别元素不进行插入 49

17.2插入图像文件 50

17.2.1在标题前插入图像文件 50

17.2.2插入图像文件的好处 51

17.2.3将alt属性的值作为图像的标题来显示 53

17.3使用content属性来插入项目编号 53

17.3.1在多个标题前加上连续编号 54

17.3.2在项目编号中追加文字 55

17.3.3指定编号的样式 55

17.3.4指定编号的种类 56

17.3.5编号嵌套 56

17.3.6中编号中嵌入大编号 58

17.3.7在字符串两边添加嵌套文字符号 59

第18章 文字与字体相关样式 62

18.1给文字添加阴影——text-shadow属性 62

18.1.1 text-shadow属性的使用方法 62

18.1.2位移距离 64

18.1.3阴影的模糊半径 65

18.1.4阴影的颜色 65

18.1.5指定多个阴影 66

18.2让文本自动换行word-break属性 66

18.2.1依靠浏览器让文本自动换行 67

18.2.2指定自动换行的处理方法 67

18.3让长单词与URL地址自动换行——word-wrap属性 69

18.4指定用户是否可选取文字的user-select属性 69

18.5使用服务器端字体——Web Font与@font-face属性 70

18.5.1在网页上显示服务器端字体 71

18.5.2定义斜体或粗体字体 72

18.5.3显示客户端本地的字体 74

18.5.4属性值的指定 76

18.6修改字体种类而保持字体尺寸不变——font-size-adjust属性 77

18.6.1字体不同导致文字大小的不同 77

18.6.2 font-size-adjust属性的使用方法 78

18.6.3浏览器对于aspect值的计算方法 78

18.6.4 font-size-adjust属性的使用示例 79

18.7使用rem单位定义字体大小 80

第19章 盒相关样式 82

19.1盒的类型 82

19.1.1盒的基本类型 82

19.1.2 inline-block类型 84

19.1.3 inline-table类型 91

19.1.4 list-item类型 93

19.1.5 run-in类型与compact类型 94

19.1.6表格相关类型 95

19.1.7 none类型 97

19.1.8各种浏览器对于各种盒类型的支持情况 98

19.2对于盒中容纳不下的内容的显示 99

19.2.1 overflow属性 99

19.2.2 overflow-x属性与overflow-y属性 102

19.2.3 text-overflow属性 103

19.3对盒使用阴影 105

19.3.1 box-shadow属性的使用方法 105

19.3.2将参数设定为0 105

19.3.3创建盒内阴影 107

19.3.4对盒内子元素使用阴影 107

19.3.5对第一个文字或第一行使用阴影 108

19.3.6对表格及单元格使用阴影 109

19.4指定针对元素的宽度与高度的计算方法 110

19.4.1 box-sizing属性 110

19.4.2为什么要使用box-sizing属性 113

第20章 背景与边框相关样式 115

20.1与背景相关的新增属性 115

20.1.1指定背景的显示范围——background-clip属性 116

20.1.2指定背景图像的绘制起点——background-origin属性 118

20.1.3指定背景图像的尺寸——background-size属性 120

20.1.4新增的用于平铺背景图像的选项——space与round 124

20.2在一个元素中显示多个背景图像 126

20.3使用渐变色背景 127

20.3.1绘制线性渐变 127

20.3.2绘制放射性渐变 130

20.4圆角边框的绘制 133

20.4.1 border-radius属性 134

20.4.2在border-radius属性中指定两个半径 134

20.4.3不显示边框的时候 135

20.4.4修改边框种类的时候 136

20.4.5绘制四个角不同半径的圆角边框 136

20.5使用图像边框 136

20.5.1 border-image属性 136

20.5.2 border-image属性的最简单的使用方法 138

20.5.3使用border-image属性来指定边框宽度 139

20.5.4指定4条边中图像的显示方法 140

20.5.5使用背景图像 143

第21章CSS 3中的变形处理 145

21.1 transform功能的基础知识 145

21.1.1如何使用transform功能 145

21.1.2 transform功能的分类 146

21.2对一个元素使用多种变形 151

21.2.1对一个元素使用多种变形的方法 151

21.2.2指定变形的基准点 154

21.3使用3D变形功能 156

21.3.1 3D变形功能概述 156

21.3.2实现3D变形功能 157

21.4变形矩阵 165

21.4.1矩阵概述 165

21.4.2变形与坐标系统 166

21.4.3计算2D变形 166

21.4.4计算3D变形 168

21.4.5通过矩阵执行多重变形处理 169

第22章CSS 3中的动画功能 172

22.1 Transitions功能 173

22.1.1 Transitions功能的使用方法 173

22.1.2使用Transitions功能同时平滑过渡多个属性值 174

22.2 Animations功能 177

22.2.1 Animations功能的使用方法 177

22.2.2实现多个属性值同时改变的动画 180

22.2.3实现动画的方法 183

22.2.4实现网页的淡入效果 184

22.3 Web Animations API 185

22.3.1 Web Animations API的基本概念 185

22.3.2 Web Animations API的使用示例 186

22.3.3控制动画播放 190

第23章 布局相关样式 194

23.1多栏布局 195

23.1.1使用float属性或position属性的缺点 195

23.1.2使用多栏布局方式 196

23.2盒布局 202

23.2.1使用float属性或position属性时的缺点 202

23.2.2使用盒布局 204

23.2.3盒布局与多栏布局的区别 205

23.3弹性盒布局 206

23.3.1对多个元素使用flex属性 206

23.3.2改变元素的显示顺序 208

23.3.3改变元素的排列方向 209

23.3.4元素宽度与高度的自适应 210

23.3.5使用弹性盒布局来消除空白 213

23.3.6对多个元素使用flex属性 214

23.3.7控制换行方式 221

23.3.8指定水平方向与垂直方向的对齐方式 224

23.4网格布局 236

23.4.1网格布局概述 236

23.4.2定义网格布局 237

23.4.3命名网格线 241

23.4.4使用区域 243

23.5 calc方法 247

23.5.1 calc方法概述 247

23.5.2 calc方法使用示例 247

第24章 媒体查询表达式与特性查询表达式 249

24.1媒体查询表达式 250

24.1.1根据浏览器的窗口大小来选择使用不同的样式 250

24.1.2在iPhone中的显示 254

24.1.3媒体查询表达式的使用方法 255

24.2特性查询表达式 257

第25章CSS 3的其他重要样式和属性 260

25.1颜色相关样式 260

25.1.1利用alpha通道来设定颜色 261

25.1.2 alpha通道与opacity属性的区别 263

25.1.3指定颜色值为transparent 265

25.2用户界面相关样式 266

25.2.1轮廓相关样式 267

25.2.2 resize属性 269

25.3使用initial属性值取消对元素的样式指定 270

25.3.1取消对元素的样式指定 270

25.3.2使用initial属性值并不等于取消样式设定的特例 272

25.4用于控制鼠标事件的pointer-events属性 273

25.5实现CSS 3中的滤镜特效 274

25.5.1滤镜特效概述 274

25.5.2实现滤镜特效 275

25.6 CSS变量 284

25.6.1 CSS变量的基本概念 284

25.6.2 CSS变量的定义方法 284

25.6.3 CSS变量的继承 285

25.6.4使用var函数 286

25.6.5在JavaScript脚本代码中使用CSS变量 289

第26章 综合实例 291

26.1实例概述 291

26.2 HTML 5页面代码分析 292

26.3 CSS 3样式代码分析 295

26.4 JavaScript脚本代码分析 299

26.4.1保存与读取本地数据库中数据 300

26.4.2使用Fetch API读取服务器端数据及提交数据到服务器端 306

26.4.3保存与读取LocalStorage中数据 308

26.4.4页面完整脚本代码 309