内 容 简 介本书从初学者的角度出发，以通俗易懂的语言、丰富多彩的案例，详细介绍如何使用HTML、CSS和JavaScript设计直观、漂亮、功能强大的网页。全书共分为16章，主要内容包括HTML发展历史、开发工具、文档语法、头部内容和主体内容的常用标记、网页注释，文本标记和列表标记，表格设计和表单输入，层和框架，HTML 5中的新增元素、新增表单、文件应用、数据存储对象、本地数据库、Web离线应用、WebWork处理线程、跨文档消息通信、地理位置信息的获取，CSS发展历史、CSS注释、CSS选择器、CSS关键字和字符串，基本单位、字体属性、文本属性、背景属性、边框属性、间隙和填充属性，CSS 3中新增的选择器、颜色和文本属性、边框属性、背景属性、盒布局和多列布局属性、用户界面属性、渐变效果、过渡属性、转换和动画属性，JavaScript历史、数据类型、变量、常用运算符，选择语句、循环语句、break语句、continue语句、return语句、异常处理语句，系统对象、内置函数、自定义对象和函数，以及JavaScript中的正则表达式和事件处理等。在本书最后一章的综合案例中，通过3个完整的案例，演示HTML、CSS和JavaScript的使用。本书所有的知识点都结合具体的示例进行介绍，涉及到的程序代码都给出了详细的注释，能够使读者轻松领会使用HTML、CSS和JavaScript开发网页的精髓，快速提高开发技能。本书可供从事网页设计的初学者阅读，也可作为非计算机专业学生的参考资料。前 言
随着Web 2.0的广泛应用，标准化的设计方式正逐渐取代传统的布局方式，网页开发者必须掌握新知识和新技术。HTML(Hyper Text Markup Language，超文本标记语言)是用来描述网页的一种语言，它提供了一系列的标记来描述网页；CSS(Cascading Style Sheets，层叠样式表)样式定义了如何显示HTML中的标记；JavaScript是世界上最流行的一种轻量级的编程语言，它不仅可用于HTML和Web，还可以广泛用于服务器、PC、笔记本电脑、平板电脑以及智能手机等设备。
HTML + CSS + JavaScript构建网页已经成为标准化的设计方式，它们扮演着各自的角色。HTML是基础架构；CSS是元素格式、页面布局的灵魂；而JavaScript是实现网页的动态性、交互性的点睛之笔。本书将向读者介绍HTML、CSS和JavaScript的相关知识，它们是相对独立的，但是在内容上又是依次递进的。
1. 本书内容
本书共分为16章，主要内容如下。
第1章：HTML基础语法。内容包括HTML概念、发展历史、开发工具、基础语法、注释，以及文本头部和文档主体常用的一些标记等。
第2章：文本标记和列表标记。详细介绍HTML中常用的文本标记和列表标记。另外，还介绍了列表标记的嵌套。
第3章：表格设计和表单输入。包含表格和表单两部分内容。其中表格包括基本语法、常用属性以及如何分组显示等内容；表单包括概念、基本语法以及常用元素等内容。
第4章：层和框架。首先从层的基础知识开始介绍，接着介绍框架的基础知识，然后介绍框架标记和内联框架，最后介绍框架集。
第5章：HTML 5的新增元素。先介绍HTML 5的语法和浏览器兼容情况，然后详细介绍HTML 5中新增加的元素，包括结构元素、语义元素、多媒体元素、绘图元素以及命令元素等。
第6章：HTML 5新增表单及其应用。包括表单和文件两大部分，详细介绍新增的表单属性、表单元素、表单输入类型，与文件有关的multiple属性、file对象、FileReader接口，以及拖拽事件和dataTransfer对象等。
第7章：HTML 5的高级功能。对HTML 5中新增加的一些高级功能进行介绍，例如数据存储对象、本地数据库存储、Web离线应用、WebWork处理线程以及跨文档消息通信和地理位置的获取等。
第8章：CSS基础语法。将向读者介绍CSS的发展历史、特点、注释规范、CSS 2使用的选择器以及如何在网页中插入CSS样式等多个内容。
第9章：CSS的常用属性。着重介绍CSS规范中提供的一些常用属性，包括字体属性、文本属性、背景属性、边框属性以及填充和间距属性等。
第10章：CSS 3的新增属性。向读者介绍CSS 3中新增的一些内容，包括新增选择器、新增颜色和文本属性、新增边框和背景属性、新增盒布局和多列布局属性、用户界面属性，以及过渡、转换、动画和渐变属性等。
第11章：JavaScript基础语法。从JavaScript的概念开始介绍，接着介绍JavaScript的代码位置和注释代码，然后分别介绍JavaScript中常用的数据类型、变量及运算符。
第12章：JavaScript的常用语句。主要介绍流程控制语句和异常处理语句。其中，流程控制语句包括选择语句、循环语句、break语句和continue语句等。
第13章：系统对象和函数。介绍JavaScript的对象和函数，包括对象的组成、对象属性和方法的获取、浏览器对象、内置对象、自定义对象、系统函数以及自定义函数等多个内容。
第14章：正则表达式。从正则表达式的基本内容开始介绍，然后依次介绍其匹配规则、常用的正则表达式、RegExp对象以及支持正则表达式的String对象的方法等多个内容。
第15章：JavaScript的事件处理。着重介绍JavaScript中的事件，包括事件概述、原始事件模型、标准事件模型和IE事件模型等。
第16章：综合案例实践。将HTML、CSS和JavaScript结合起来，实现3个简单的、比较完整的综合案例。这3个案例分别是音乐网页、贪吃蛇游戏和俄罗斯方块游戏。
2. 本书特色
本书中的大量内容来自于实际的开发项目，针对初学者和中级读者量身定做，由浅入深地介绍与HTML、CSS和JavaScript有关的知识。
本书具有以下特色。
(1) 知识全面，内容丰富
本书紧密围绕HTML、CSS和JavaScript中常用的知识点展开讲解，涵盖了实际开发中所遇到的页面标记、高级开发(例如Web离线程序、获取地理位置信息)、样式设计、脚本处理等多种知识点。
(2) 基于理论，注重实践
本书不仅介绍理论知识，而且在合适位置安排综合实验指导或者小型应用程序，将理论知识应用到实践中，以加强读者的实际应用能力，巩固基础知识。
(3) 提供案例，清晰实用
对于大多数的精选案例，都向读者提供了详细步骤，结构清晰简明，分析深入浅出，而且有些程序能够直接在项目中使用，可避免读者进行二次开发。
(4) 配备光盘，利于学习
本书为示例配备了视频教学文件，读者可以通过视频文件更加直观地学习与HTML、CSS和JavaScript有关的技术知识。
(5) 贴心提示，方便周到
为了便于读者阅读，全书还穿插着一些技巧、提示等小贴士，体例约定如下。
提示：通常是一些贴心的提醒，让读者加深印象，或者获得解决问题的方法。
注意：提出学习过程中需要特别注意的一些知识点和内容，或者相关的信息。
技巧：通过简短的文字，指出知识点在应用时的一些小窍门。
3. 读者对象
本书适合作为软件开发入门者的自学用书，也适合作为高等院校相关专业的教学参考书，还可供开发人员查阅和参考。
4. 编写人员
除了本书的封面作者之外，参与本书编写的人员还有侯政云、刘利利、郑志荣、肖进、侯艳书、崔再喜、侯政洪、李海燕、祝红涛、刘俊强等。在本书的编写过程中，我们力求精益求精，但难免存在一些不足之处，恳请广大读者批评指正。目 录
第1章 HTML基础语法 1
1.1 了解HTML语言 1
1.1.1 HTML概述 1
1.1.2 HTML发展历史 2
1.1.3 HTML编辑器 3
1.1.4 认识Dreamweaver工具 4
1.2 HTML的语法 7
1.2.1 HTML文档 7
1.2.2 标记语法 7
1.2.3 属性语法 8
1.2.4 全局属性 9
1.3 头部内容 10
1.3.1 <title>标记 11
1.3.2 <base>标记 11
1.3.3 <meta>标记 12
1.3.4 <style>标记 13
1.3.5 <script>标记 13
1.4 主体内容 14
1.4.1 页面背景 14
1.4.2 页面边距 14
1.4.3 段落标记 15
1.4.4 超链接标记 16
1.4.5 图像标记 17
1.4.6 其他常用标记 18
1.5 为HTML添加注释 22
1.6 实验指导——显示一篇完整的文章 23
1.7 习题 24
第2章 文本标记和列表标记 26
2.1 文本标记 26
2.1.1 <font>标记 26
2.1.2 <ruby>标记 27
2.1.3 物理样式标记 28
2.1.4 逻辑样式标记 28
2.2 列表标记 29
2.2.1 列表标记的用途 29
2.2.2 无序列表 30
2.2.3 有序列表 31
2.2.4 解说列表 35
2.3 列表嵌套 37
2.3.1 标记自身嵌套 37
2.3.2 解说列表嵌套无序列表 38
2.3.3 无序列表嵌套有序列表 38
2.4 实验指导——实现多层列表嵌套 40
2.5 习题 41
第3章 表格设计和表单输入 43
3.1 了解表格 43
3.1.1 表格结构 43
3.1.2 设置单元格 44
3.1.3 表格的标题 45
3.2 表格标记的属性 46
3.2.1 宽度和高度 46
3.2.2 背景颜色 47
3.2.3 边框设置 47
3.2.4 单元格间距 48
3.2.5 行内容水平对齐 48
3.2.6 跨行和跨列 49
3.2.7 表格的描述 50
3.3 表格分组显示 50
3.3.1 按行分组显示 50
3.3.2 按列分组显示 52
3.4 实验指导——将表格进行嵌套 54
3.5 了解表单 56
3.5.1 表单概述 56
3.5.2 表单语法 57
3.6 表单元素 58
3.6.1 input元素 58
3.6.2 textarea元素 59
3.6.3 select元素 60
3.7 实验指导——设计用户资料修改页面 62
3.8 习题 65
第4章 层和框架 66
4.1 了解层 66
4.1.1 div元素 66
4.1.2 div的属性 67
4.1.3 并列图层的遮挡 70
4.2 了解框架 70
4.2.1 框架概述 70
4.2.2 框架的结构 72
4.3 框架标记 74
4.3.1 frameset元素 74
4.3.2 noframes元素 74
4.3.3 frame元素 75
4.4 实验指导——搭建用户信息管理系统的框架 75
4.5 内联框架 80
4.5.1 iframe元素 80
4.5.2 使用iframe元素 81
4.6 框架和框架集 83
4.7 实验指导——使用Dreamweaver创建框架集 83
4.8 习题 87
第5章 HTML 5的新增元素 89
5.1 了解HTML 5 89
5.1.1 HTML 5概述 89
5.1.2 浏览器支持情况 90
5.1.3 HTML 5的标记方法 91
5.1.4 HTML 5兼容HTML 92
5.2 结构元素 94
5.2.1 header元素 94
5.2.2 article元素 95
5.2.3 section元素 97
5.2.4 nav元素 98
5.2.5 hgroup元素 98
5.2.6 footer元素 99
5.3 语义元素 99
5.3.1 块级语义元素 100
5.3.2 行内语义元素 101
5.4 多媒体元素 103
5.4.1 多媒体概述 103
5.4.2 audio元素 105
5.4.3 video元素 108
5.4.4 source元素 110
5.4.5 判断浏览器的支持情况 112
5.5 绘图元素 113
5.5.1 canvas元素 113
5.5.2 使用canvas元素 114
5.6 HTML 5的其他新增元素 115
5.6.1 其他新增元素 115
5.6.2 details元素 116
5.6.3 command元素 117
5.6.4 track元素 118
5.7 实验指导——用HTML 5的新增元素构建网页 118
5.8 习题 123
第6章 HTML 5新增表单及其应用 125
6.1 新增的表单属性 125
6.2 新增的表单元素 126
6.2.1 datalist元素 126
6.2.2 keygen元素 127
6.2.3 output元素 128
6.3 新增输入类型 129
6.3.1 search类型 129
6.3.2 email类型 130
6.3.3 url类型 131
6.3.4 datepicker类型 132
6.3.5 number类型 133
6.3.6 range类型 134
6.3.7 color类型 135
6.3.8 tel类型 136
6.4 实验指导——个人用户信息注册 137
6.5 文件上传操作 139
6.5.1 multiple属性 140
6.5.2 file对象 141
6.5.3 FileReader接口 142
6.6 实验指导——用FileReader对象读取文件 145
6.7 文件拖拽功能 148
6.7.1 拖拽事件 148
6.7.2 dataTransfer对象 148
6.8 习题 152
第7章 HTML 5实现高级功能 154
7.1 数据存储对象 154
7.1.1 localStorage对象 154
7.1.2 sessionStorage对象 158
7.2 本地数据库 160
7.2.1 打开和创建数据库 160
7.2.2 事务处理方法 161
7.2.3 执行数据操作 162
7.3 实验指导——用本地数据库保存和读取数据 163
7.4 Web离线应用程序 167
7.4.1 缓存清单 167
7.4.2 本地缓存对象 169
7.5 Web Worker处理线程 170
7.5.1 创建Worker对象 170
7.5.2 使用Worker对象 171
7.6 跨文档消息通信 173
7.7 获取地理位置信息 175
7.7.1 Geolocation API概述 175
7.7.2 position对象概述 177
7.8 实验指导——利用Google地图显示当前位置 179
7.9 习题 182
第8章 CSS基础语法 184
8.1 了解CSS 184
8.1.1 CSS概述 184
8.1.2 CSS发展简史 186
8.1.3 使用CSS的好处 186
8.1.4 CSS注释 186
8.2 在网页中插入CSS样式表 187
8.2.1 内联样式 187
8.2.2 嵌入样式 188
8.2.3 外部引用样式 189
8.3 CSS选择器 192
8.3.1 元素选择器 192
8.3.2 类选择器 193
8.3.3 ID选择器 194
8.3.4 属性选择器 194
8.3.5 伪元素和伪类 196
8.3.6 其他选择器 198
8.4 关键字和字符串 200
8.4.1 关键字 200
8.4.2 字符串 200
8.5 实验指导——HTML和CSS构建网页 201
8.6 习题 204
第9章 CSS的常用属性 206
9.1 基本单位 206
9.1.1 颜色 206
9.1.2 长度 208
9.1.3 百分比值 209
9.2 字体属性 209
9.2.1 font-family属性 209
9.2.2 font-size属性 210
9.2.3 font-style属性 212
9.2.4 font-weight属性 212
9.2.5 font属性 213
9.3 文本属性 214
9.3.1 letter-spacing属性 214
9.3.2 word-spacing属性 215
9.3.3 text-decoration属性 215
9.3.4 text-align属性 216
9.3.5 text-indent属性 217
9.3.6 text-transform属性 217
9.3.7 其他常用属性 218
9.4 背景属性 219
9.4.1 background-color属性 219
9.4.2 background-image属性 220
9.4.3 background-repeat属性 221
9.4.4 background-position属性 223
9.4.5 background-attachment属性 223
9.4.6 background属性 224
9.5 边框属性 224
9.5.1 border-style属性 225
9.5.2 border-width属性 227
9.5.3 border-color属性 228
9.5.4 border属性 229
9.6 间隙和填充 230
9.6.1 间隙属性 230
9.6.2 填充属性 232
9.7 实验指导——设置文章页面的内容 233
9.8 习题 235
第10章 CSS 3的新增属性 236
10.1 新增的选择器 236
10.1.1 属性选择器 236
10.1.2 常用的伪类选择器 238
10.1.3 UI元素状态伪类选择器 241
10.1.4 通用兄弟选择器 242
10.2 新增的颜色和文本 242
10.2.1 颜色单位 242
10.2.2 文本属性 244
10.2.3 @font-face规则 246
10.3 新增边框和背景 248
10.3.1 边框属性 248
10.3.2 背景属性 251
10.4 新增的盒布局和多列布局 254
10.4.1 盒布局属性 254
10.4.2 多列类布局属性 257
10.5 用户界面属性 259
10.6 其他高级属性 261
10.6.1 渐变的实现 262
10.6.2 新增的过渡 264
10.6.3 新增的转换 266
10.6.4 新增的动画 268
10.7 实验指导——设计直观大方的表单 270
10.8 习题 273
第11章 JavaScript基础语法 275
11.1 了解JavaScript 275
11.1.1 JavaScript概述 275
11.1.2 JavaScript代码的位置 276
11.1.3 JavaScript注释代码 278
11.1.4 编写JavaScript程序 278
11.2 数据类型和变量 279
11.2.1 数据类型 279
11.2.2 变量 281
11.3 常用运算符 282
11.3.1 算术运算符 282
11.3.2 赋值运算符 284
11.3.3 比较运算符 285
11.3.4 逻辑运算符 285
11.3.5 字符串运算符 287
11.3.6 位操作运算符 287
11.3.7 三元运算符 288
11.4 实验指导——字符围绕鼠标动态改变 288
11.5 习题 290
第12章 JavaScript的常用语句 293
12.1 顺序语句 293
12.2 选择语句 293
12.2.1 基本的if语句 294
12.2.2 if else语句 294
12.2.3 if else if else语句 295
12.2.4 if语句的嵌套 297
12.2.5 switch语句 298
12.3 循环语句 300
12.3.1 for语句 300
12.3.2 for in语句 301
12.3.3 while语句 302
12.3.4 do while语句 303
12.4 其他语句 303
12.4.1 break语句 303
12.4.2 continue语句 304
12.4.3 return语句 305
12.4.4 with语句 306
12.5 异常处理语句 306
12.5.1 try catch语句 306
12.5.2 try catch finally语句 308
12.6 实验指导——计算器 308
12.7 习题 310
第13章 系统对象和函数 313
13.1 对象概述 313
13.1.1 对象的组成 313
13.1.2 获取对象的属性 314
13.1.3 引用对象方法 314
13.2 浏览器对象 314
13.2.1 window对象 315
13.2.2 navigator对象 317
13.2.3 document对象 318
13.2.4 location对象 321
13.2.5 history对象 322
13.2.6 screen对象 322
13.3 内置对象 323
13.3.1 String对象 323
13.3.2 Array对象 325
13.3.3 Date对象 328
13.3.4 Math对象 330
13.4 自定义对象 332
13.5 系统函数 333
13.6 自定义函数 334
13.6.1 函数语法 334
13.6.2 调用函数 335
13.6.3 全局变量和局部变量 335
13.6.4 动态函数 336
13.7 实验指导——创建日历生成器 337
13.8 习题 342
第14章 正则表达式 343
14.1 正则表达式概述 343
14.2 匹配规则 344
14.2.1 定位符 344
14.2.2 限定符 345
14.2.3 选择匹配符 346
14.2.4 字符匹配符 346
14.2.5 原义字符 347
14.2.6 特殊字符 348
14.2.7 其他匹配符 348
14.3 常用的正则表达式 349
14.3.1 匹配特定数字 350
14.3.2 匹配特定字符串 350
14.3.3 匹配其他内容 350
14.4 RegExp对象 352
14.4.1 创建RegExp对象 352
14.4.2 属性和方法 352
14.5 实验指导——验证手机号码和电话号码 353
14.6 实验指导——验证IP地址是否合法 356
14.7 支持正则表达式的String对象的方法 359
14.7.1 search()方法 359
14.7.2 match()方法 360
14.7.3 replace()方法 360
14.7.4 split()方法 362
14.8 习题 362
第15章 JavaScript的事件处理 364
15.1 事件概述 364
15.1.1 事件简介 364
15.1.2 指定事件 365
15.2 原始事件模型 366
15.2.1 事件类型 366
15.2.2 事件处理 368
15.2.3 使用事件返回值 369
15.2.4 使用this关键字 371
15.3 标准事件模型 372
15.3.1 事件传播 372
15.3.2 注册事件处理程序 373
15.3.3 事件的模块和类型 374
15.3.4 常用接口概述 375
15.4 实验指导——实现视频的多种操作 377
15.5 IE事件模型 381
15.5.1 IE Event对象 381
15.5.2 IE的事件传播 382
15.6 习题 382
第16章 综合案例实践 384
16.1 设计音乐网页 384
16.1.1 网页效果 384
16.1.2 设计头部区域 386
16.1.3 实现主体内容 389
16.2 贪吃蛇游戏 394
16.2.1 设计页面 394
16.2.2 JavaScript代码 395
16.3 俄罗斯方块游戏 404
16.3.1 了解俄罗斯方块游戏 404
16.3.2 设计页面代码 404
16.3.3 JavaScript脚本实现 406
