
本书第3版紧贴互联网行业发展对Web前端开发工程师岗位的新要求,结合众多高校教师的教学反馈意见和建议,在第2版的基础上新增加了HTML5和CSS3相关新特性和新应用。全书详细地介绍了HTML、CSS、DIV、HTML5基础和CSS3应用、JavaScript、DOM与BOM、HTML5高级应用等部分的基本语法和关键应用。内容编排结构合理,由浅入深,循序渐进地引导读者快速入门,并能提高初级及以上读者的实际应用水平,让读者能够快速适应移动互联网行业对Web前端开发工程师岗位的新需求。
本书可作为高等学校计算机科学与技术、软件工程、信息管理与信息系统、网络工程、物联网工程、信息科学技术、数字媒体技术、数据科学与技术(大数据管理相关)及其他文、理科相关专业或计算机公共基础的“网页开发与设计”“网站建设与网页制作”“Web客户端编程”“Web前端开发技术”“Web应用技术”等课程教学的教材,也可作为IT相关岗位的工程技术人员参考用书,还可以作为初学者的自学读本
本书第2版自2016年8月由清华大学出版社出版以来,受到全国各类高等院校的青睐。教材覆盖地域宽广,教材使用层次多样。近年来陆续被武汉大学、重庆大学、吉林大学、北京理工大学、西北农林科技大学、北京邮电大学、东南大学、河海大学、上海大学等200多所高等院校选作教材或教学参考书。教材第1版获“第四届中国大学出版社图书奖优秀教材二等奖”。2016年第2版理论教材与实践教材双双入选“教育部高等学校软件工程专业教学指导委员会规划教材”(全国仅2部教材入选)。
Web前端开发技术已经成为21世纪高等学校学生及IT职员跨入互联网世界的最基础的入门技术。随着“互联网+”模式的不断推广与普及,IT行业对Web前端开发工程师所掌握的知识和能力要求也随之提高了,结合IT行业发展的需要和各类高等院校的实际教学反馈,编者在保持前2个版本教材原有特色和编写风格的基础上,适时将HTML5和CSS3等技术补充到教材之中,以期满足当前IT行业需要和高等学校培养应用技术型人才的需要。
教材编写特色
内容新颖全面。紧贴Web前端开发工程师的岗位需求,精心策划教学内容。全面讲解HTML、CSS、DIV、HTML5基础和CSS3应用、JavaScript、DOM与BOM、HTML5高级应用等内容。
实例真实丰富。从商业网站精选实例,每章再遴选一个经典的综合案例,将本章和相邻章节的知识融会贯通。
讲解图文并茂。使用大量图表、图片进行归纳与分析,以提高教学效率。
代码规范统一。提供风格统一、格式规范的源代码,培养读者良好的编程习惯。
微课视频精美。关键知识和操作技能配套精美的微课视频讲解,让学生无师自通。
本次修订内容
第3版修订教材共规划了17章。保留第2版中的第1~4章;对第5章内容进行更新与重组,将第2版中的第12章框架中浮动框架部分并入新版的第5章中;简化第6章图像与多媒体文件;保留第2版第7章CSS基础、第8章DIV与SPAN、第9章CSS样式属性、第10章DIV+CSS页面布局、第11章表格,并将CSS3中的属性选择器补充到第7章中;删除第2版中第12章框架;将第2版中第13章表单改为第3版的第12章表单;新增第13章HTML5基础和CSS3应用;保留第2版中第14~16章;删除第2版中第17章多浏览器兼容性测试、网站调试与发布,更新为新的第17章HTML5高级应用。同时根据多数使用高校教师的建议和反馈意见对各章节内容和案例进行优化和重组。
限于篇幅,删除第2版中每章结尾的“网站赏析”“工具介绍”等课外资源。
主要内容
第1章和第2章重点介绍了Web起源、Web特点与工作原理、Web前端开发技术、开发工具及HTML基础语法和文档结构等知识;第3~6章重点介绍了HTML网页中格式化文本与段落、列表、超链接与浮动框架、图像与多媒体文件的应用;第7~10章重点介绍了CSS基础、DIV与SPAN、CSS样式属性、DIV+CSS页面布局;第11~12章重点介绍了表格、表单等页面布局技术;第13章重点介绍了HTML5基础和CSS3应用;第14~16章重点介绍了JavaScript基础、JavaScript程序结构、事件分析、DOM与BOM初步应用;第17章重点介绍了HTML5高级应用。
教学资源
为了方便各类高校选用教材进行教学和读者选书自学,第3版教材依然提供了大量的实例代码及其他资源。教材中教学案例以统一格式进行命名,如edu_2_1_1.html表示第2章2.1节第1个案例。每章资源以子目录形式存放,如ch5,存放第5章的教学资源,有教学案例、图片、音视频等资源。同时还同步改编了配套实验与实践教材《Web前端开发技术实验与实践——HTML5、CSS3、JavaScript(第3版)》,除此之外,我们准备了各种辅助教学材料,包括:
(1)一套完整的教学精简版的PPT。
(2)一套完整的教学案例代码。
(3)一套完整的教学与实验中所需的图片、文字、音视频素材。
(4)一套完整的练习与实验参考答案。
(5)六套完整的课程考试试卷及参考答案。
(6)提供案例微课视频讲解。
第3版修订由储久良负责总体策划、编著、审校。南京理工大学王永利教授、叶庆生副教授,浙江工商大学贾波教授,西北农林科技大学蔚继承副教授,辽宁工程技术大学陈虹副教授、肖振久副教授,常熟理工学院高燕副教授,南华大学赵艳辉副教授,唐山学院党长青教授、顾永军副教授,华北科技学院胡英老师,河南工程学院张劳模副教授,成都大学于曦副教授,泰州学院刘立军副教授、花丽副教授,牡丹江大学谢凤静副教授等对教材的再版工作提出了很多宝贵意见,在此对他们表示感谢。此外,姜枫、袁宝华、曹红根、高广银、李丛、刘立军、花丽、宦臣、沈群、曹诚诚、张晓群、王鑫等教师参与了教材编写工作,对他们的辛苦劳动表示由衷感谢!
本书的修订与再版得到清华大学出版社相关人员的大力支持与合作,在此谨表示衷心感谢。在修订过程中,编者参阅了大量的Web前端开发、JavaScript应用、HTML5和CSS3相关等方面的书籍与网络资料,在此对这些书籍与资料的作者表示感谢。由于移动互联网技术发展迅速,加上编者水平有限,书中的不足在所难免,恳请各位专家和读者批评指正。编者的联系方式为E-mail:jlchu@163.com或直接与出版社联系。
编 者
2017年07月于苏州方圆·云山诗意
第1章 Web前端开发技术综述 1
1.1 Web概述 1
1.1.1 Web的起源 2
1.1.2 Web的特点 3
1.1.3 Web工作原理 3
1.1.4 Web相关概念 4
1.2 Web前端开发工程师的职业需求 6
1.2.1 Web前端开发的由来 6
1.2.2 Web前端开发工程师的职业要求 6
1.3 Web前端开发技术 7
1.3.1 HTML 7
1.3.2 CSS 8
1.3.3 JavaScript 9
1.3.4 HTML DOM 9
1.3.5 BOM 10
1.3.6 AJAX 10
1.3.7 jQuery 11
1.4 Web前端开发工具 11
1.4.1 EditPlus 11
1.4.2 Adobe Dreamweaver 11
1.4.3 Sublime Text 12
1.4.4 WebStorm 12
1.4.5 HBuilder 13
1.5 浏览器工具 13
1.5.1 Internet Explorer 14
1.5.2 Google Chrome 14
1.5.3 Mozilla Firefox 14
1.5.4 Safari 14
1.5.5 Opera 14
1.6 综合实例 15
本章小结 16
练习与实验 16
练习1 16
实验1 17
第2章 HTML基础 18
2.1 HTML文档结构 18
2.2 头部head 19
2.2.1 标题title标记 19
2.2.2 元信息meta标记 20
2.3 主体body 22
2.3.1 body标记 22
2.3.2 body标记属性 23
2.4 HTML基本语法 25
2.4.1 标记类型 25
2.4.2 HTML属性 26
2.5 注释 27
2.6 HTML文档编写规范 28
2.6.1 HTML代码书写规范 28
2.6.2 HTML文档命名规则 29
2.7 HTML文档类型 30
2.7.1 <!DOCTYPE>标记 30
2.7.2 DTD类型 30
2.8 综合实例 31
本章小结 32
练习与实验 32
练习2 32
实验2 33
第3章 格式化文本与段落 34
3.1 Web页面初步设计 34
3.1.1 向Web页面添加文字信息 34
3.1.2 标题字标记 35
3.1.3 添加空格与特殊符号 36
3.2 格式化文本标记 37
3.2.1 文本修饰标记 37
3.2.2 计算机输出标记 38
3.2.3 引用和术语标记 38
3.2.4 字体font标记 39
3.3 段落与排版标记 40
3.3.1 段落p标记 40
3.3.2 换行br标记 41
3.3.3 水平分隔线hr标记 41
3.3.4 拼音/音标注释ruby标记和rt/rp标记 42
3.3.5 段落缩进blockquote标记 43
3.3.6 预格式化pre标记 44
3.4 综合实例 45
本章小结 46
练习与实验 46
练习3 46
实验3 47
第4章 列表 49
4.1 列表概述 49
4.2 无序列表 49
4.3 有序列表 51
4.4 列表嵌套 53
4.5 定义列表 54
4.6 综合实例 56
本章小结 57
练习与实验 57
练习4 57
实验4 58
第5章 超链接与浮动框架 59
5.1 超链接概述 59
5.2 超链接语法、路径及分类 59
5.2.1 超链接语法 59
5.2.2 超链接路径 61
5.2.3 超链接分类 62
5.3 超链接的应用 62
5.3.1 创建HTTP文件下载超链接 62
5.3.2 创建FTP站点访问超链接 62
5.3.3 创建图像超链接 63
5.3.4 创建电子邮件超链接 63
5.3.5 创建页面书签链接 65
5.4 浮动框架 67
5.5 综合实例 69
本章小结 70
练习与实验 70
练习5 70
实验5 71
第6章 图像与多媒体文件 73
6.1 图像 73
6.1.1 插入图像 73
6.1.2 设置图像的替代文本 75
6.1.3 设置图像的高度和宽度 75
6.1.4 设置图像的边框 76
6.1.5 设置图像对齐方式 77
6.1.6 设置图像的间距 77
6.1.7 设置图像热区链接 77
6.2 滚动文字 79
6.2.1 添加滚动文字 79
6.2.2 设置滚动文字背景颜色与滚动循环 80
6.2.3 设置滚动方向与滚动方式 80
6.2.4 设置滚动速度与滚动延迟 81
6.2.5 设置滚动范围与滚动空白空间 81
6.3 音频、视频及Flash文件 82
6.4 综合实例 84
本章小结 85
练习与实验 85
练习6 85
实验6 86
第7章 CSS基础 88
7.1 CSS概念 88
7.1.1 CSS的基本概念 88
7.1.2 传统HTML的缺点 88
7.1.3 CSS的特点 89
7.1.4 CSS的优势 89
7.1.5 CSS的编辑方法 89
7.2 使用CSS控制Web页面 90
7.2.1 CSS基本语法 90
7.2.2 CSS选择器类型 91
7.2.3 CSS选择器声明 95
7.2.4 CSS定义与引用 96
7.3 CSS继承与层叠 101
7.4 综合实例 102
本章小结 105
练习与实验 106
练习7 106
实验7 106
第8章 DIV与SPAN 108
8.1 DIV图层 108
8.1.1 DIV定义 108
8.1.2 DIV应用 109
8.2 图层嵌套与层叠 110
8.2.1 DIV嵌套 110
8.2.2 DIV层叠 111
8.3 div标记与span标记 112
8.4 综合实例 114
本章小结 118
练习与实验 118
练习8 118
实验8 119
第9章 CSS样式属性 120
9.1 CSS属性值中的单位 120
9.1.1 绝对单位 120
9.1.2 相对单位 120
9.2 CSS字体样式 121
9.2.1 字体大小font-size属性 121
9.2.2 字体样式font-style属性 122
9.2.3 字体系列font-family属性 122
9.2.4 字体变体font-variant属性 123
9.2.5 字体粗细font-weight属性 124
9.2.6 字体font属性 124
9.3 CSS文本样式 125
9.3.1 字符间距letter-spacing属性 125
9.3.2 行距line-height属性 125
9.3.3 首行缩进text-indent属性 126
9.3.4 字符装饰text-decoration属性 127
9.3.5 英文大小写转换text-transform属性 127
9.3.6 水平对齐text-align属性 128
9.3.7 垂直对齐vertical-align属性 128
9.4 CSS颜色与背景 130
9.4.1 颜色color属性 130
9.4.2 背景background属性 131
9.5 CSS列表样式 134
9.6 CSS盒模型 136
9.6.1 CSS盒模型结构 136
9.6.2 边界属性设置 137
9.6.3 边框属性设置 138
9.6.4 填充属性设置 141
9.7 综合实例 142
本章小结 146
练习与实验 146
练习9 146
实验9 147
第10章 DIV+CSS页面布局 149
10.1 页面布局设计 149
10.1.1 “三行模式”或“三列模式” 149
10.1.2 “三行二列”“三行三列”模式 150
10.1.3 多行多列复杂模式 152
10.2 导航菜单设计 154
10.2.1 一级水平导航菜单 154
10.2.2 二级水平导航菜单 156
10.3 综合实例 162
本章小结 168
练习与实验 168
练习10 168
实验10 169
第11章 表格 170
11.1 表格概述 170
11.2 表格标记 171
11.3 表格属性设置 173
11.3.1 表格边框属性 174
11.3.2 表格的宽度和高度属性 174
11.3.3 表格背景颜色与背景图像属性 174
11.3.4 表格边框样式属性 176
11.3.5 表格单元格间距、单元格边距属性 177
11.3.6 表格水平对齐属性 178
11.4 设置表格行的属性 180
11.5 设置单元格的属性 181
11.5.1 表格单元格跨行属性 182
11.5.2 表格单元格跨列属性 182
11.6 表格嵌套 183
11.7 综合实例 185
本章小结 189
练习与实验 189
练习11 189
实验11 190
第12章 表单 191
12.1 表单概述 191
12.2 定义域和域标题 193
12.3 表单信息输入 194
12.3.1 单行文本输入框 194
12.3.2 密码输入框 195
12.3.3 复选框 196
12.3.4 单选按钮 196
12.3.5 图像按钮 198
12.3.6 提交按钮 199
12.3.7 重置按钮 199
12.3.8 普通按钮 200
12.3.9 文件选择框 201
12.3.10 隐藏框 201
12.4 多行文本输入框 203
12.5 下拉列表框 204
12.6 综合实例 205
本章小结 208
练习与实验 208
练习12 208
实验12 209
第13章 HTML5基础与CSS3应用 210
13.1 HTML5概述 210
13.1.1 HTML5的八个特性 211
13.1.2 HTML5的优势 212
13.1.3 HTML5新增结构元素及页面元素 213
13.1.4 HTML5废除的元素与属性 214
13.1.5 浏览器支持与选择 215
13.2 HTML5文档结构 216
13.2.1 HTML5页面结构 216
13.2.2 HTML5新增结构元素 217
13.3 HTML5新增页面元素 221
13.3.1 hgroup标记 222
13.3.2 figure标记与figcaption标记 222
13.3.3 mark标记与time标记 223
13.3.4 details标记与summary标记 224
13.3.5 progress标记与meter标记 225
13.3.6 input标记与datalist标记 226
13.4 HTML5表单 227
13.4.1 HTML5新增的表单属性 227
13.4.2 HTML5新增的表单元素 231
13.4.3 HTML5新增的input类型 232
13.5 HTML5视频与音频 236
13.5.1 video标记及属性 236
13.5.2 audio标记及属性 238
13.6 CSS3基础应用 239
13.6.1 CSS3新特性 239
13.6.2 CSS3浏览器兼容性 239
13.6.3 CSS3边框 240
13.6.4 CSS3转换transform属性 247
13.6.5 CSS3过渡transition属性 251
13.6.6 CSS3动画animation 253
13.6.7 CSS3多列属性 256
13.6.8 CSS3文本效果 258
13.7 综合实例 260
本章小结 262
练习与实验 262
练习13 262
实验13 263
第14章 JavaScript基础 265
14.1 JavaScript概述 265
14.1.1 JavaScript简介 265
14.1.2 第一个JavaScript程序 266
14.1.3 JavaScript放置的位置 267
14.2 JavaScript程序 270
14.2.1 语句和语句块 270
14.2.2 代码 271
14.2.3 消息对话框 271
14.2.4 JavaScript注释 274
14.3 标识符和变量 274
14.3.1 命名规范 274
14.3.2 数据类型 275
14.3.3 变量 278
14.3.4 转义字符 278
14.4 运算符和表达式 279
14.4.1 算术运算符和表达式 279
14.4.2 关系运算符和表达式 281
14.4.3 逻辑运算符和表达式 283
14.4.4 赋值运算符和表达式 284
14.4.5 位运算符和表达式 284
14.4.6 条件运算符和表达式 286
14.4.7 其他运算符和表达式 286
14.5 JavaScript程序控制结构 287
14.5.1 顺序结构 287
14.5.2 分支结构 288
14.5.3 循环结构 293
14.6 JavaScript函数 301
14.6.1 常用系统函数 301
14.6.2 自定义函数 310
14.6.3 带参数返回的return语句 311
14.6.4 函数变量的作用域 312
14.7 综合实例 313
本章小结 317
练习与实验 317
练习14 317
实验14 318
第15章 JavaScript事件分析 319
15.1 JavaScript事件概述 319
15.1.1 事件类型 319
15.1.2 事件句柄 320
15.1.3 事件处理 321
15.1.4 事件处理程序的返回值 324
15.2 表单事件 326
15.2.1 获得焦点与失去焦点事件 326
15.2.2 提交及重置事件 327
15.2.3 改变及选择事件 328
15.3 鼠标事件 329
15.3.1 鼠标单、双击事件 330
15.3.2 鼠标移动事件 331
15.4 键盘事件 332
15.5 窗口事件 333
15.6 综合实例 334
本章小结 336
练习与实验 336
练习15 336
实验15 337
第16章 DOM和BOM 339
16.1 JavaScript常用对象 339
16.1.1 Array 340
16.1.2 Date 342
16.1.3 Math 345
16.1.4 Number 347
16.1.5 String 347
16.1.6 Boolean 350
16.2 HTML DOM 351
16.2.1 DOM简介 351
16.2.2 DOM节点树 351
16.2.3 DOM节点 352
16.2.4 DOM节点访问 353
16.2.5 DOM节点操作 357
16.3 BOM 363
16.3.1 window对象 363
16.3.2 Navigator对象 366
16.3.3 Screen对象 367
16.3.4 History对象 368
16.3.5 Location对象 369
16.4 综合实例 370
本章小结 380
练习与实验 380
练习16 380
实验16 381
第17章 HTML5高级应用 383
17.1 HTML5 Web Storage 383
17.1.1 localStorage对象 383
17.1.2 sessionStorage对象 384
17.1.3 浏览器端数据库IndexedDB 386
17.2 HTML5 Canvas画布 396
17.2.1 Canvas标记 396
17.2.2 Canvas坐标 398
17.2.3 Canvas路径 399
17.2.4 Canvas绘制线段 400
17.2.5 Canvas绘制文本 402
17.2.6 Canvas渐变 402
17.2.7 Canvas绘制图像 403
17.3 HTML5拖放 406
17.3.1 设置元素为可拖放 406
17.3.2 拖放事件 407
17.3.3 dataTransfer对象 407
17.3.4 拖放操作实现步骤 408
17.4 HTML5 Web Worker 410
17.4.1 Web Worker的工作原理 410
17.4.2 创建Web Worker文件 410
17.4.3 创建Web Worker对象 410
17.4.4 终止Web Worker 411
17.5 综合实例 412
本章小结 419
练习与实验 420
练习17 420
实验17 421
附录A 模拟试卷1(120分) 423
附录B 模拟试卷2(120分) 431
参考文献 440
30小时全程语言讲解。
内容新颖全面: 紧贴Web前端开发工程师的岗位的需求,精心策划教学内容。全面讲解HTML、CSS、DIV、JavaScript、DOM与BOM、浏览器兼容性测试、网站调试与发布等内容。
实例真实丰富: 从商业网站精选实例,每章再遴选一个经典的综合实例,将本章和相邻章节的知识融会贯通。
讲解图文并茂: 使用大量图表、图片进行归纳与分析,以提高教学效率。
代码规范统一: 提供风格统一、格式规范的源代码,培养读者良好的编程习惯。
30小时全程语言讲解。
加入时,请写明:“学校+姓名”,并写明“加入教师群”,只限教师。