目　录

第 1章　网页设计基础　1
1.1　万维网概述　1
1.2　HTML语言　1
1.3　网页设计相关概念　2
1.3.1　超链接　2
1.3.2　统一资源定位器　2
1.3.3　网站　2
1.3.4　网页　2
1.3.5　首页　3
1.4　网页的开发工具和浏览工具　3
1.4.1　网页开发工具　3
1.4.2　网页浏览工具　4
1.5　网页制作相关技术　5
1.5.1　客户端应用技术　5
1.5.2　服务器端应用技术　7
习题　8

第 2章　初识HTML　9
2.1　HTML概述　9
2.1.1　HTML发展历史　9
2.1.2　手工编写页面　10
2.1.3　使用Dreamweaver创建一个HTML页面　11
2.2　文字标记　12
2.2.1　显示普通文字　13
2.2.2　输入特殊符号　13
2.2.3　标题字标记　13
2.2.4　修饰文字的标记　14
2.2.5　修饰字体标记　15
2.3　段落标记　15
2.3.1　段落标记<p>　16
2.3.2　取消文字换行标记<nobr>　16
2.3.3　修饰段落的对齐方式属性align　16
2.3.4　保留原始排版方式标记<pre>　16
2.4　超链接标记　17
2.4.1　链接标记<a>　17
2.4.2　书签链接　19
2.5　图片标记和列表标记　20
2.5.1　插入图片标记<img>　20
2.5.2　建立列表　21
2.6　综合实例——个性的留言　23
知识点提炼　24
习题　24
实验：设置字符编码　24
实验目的　24
实验内容　25
实验步骤　25

第3章　HTML中的表格　26
3.1　绘制表格　26
3.1.1　设置表格的标题　27
3.1.2　设置表格的边框属性　27
3.1.3　设置表格的宽度和高度　27
3.1.4　设置表格的边框颜色　28
3.1.5　设置表格的对齐方式　28
3.1.6　设置表格的背景颜色　29
3.1.7　设置表格的背景图片　29
3.2　行标记<tr>及属性　29
3.2.1　设置行的高度　30
3.2.2　设置行的边框颜色　30
3.2.3　设置行的背景颜色　30
3.2.4　设置行的水平对齐方式　31
3.2.5　设置行的垂直对齐方式　31
3.3　单元格标记<td>属性　32
3.3.1　设置单元格的大小　32
3.3.2　设置单元格的水平对齐属性　33
3.3.3　设置单元格的垂直对齐属性　33
3.3.4　设置单元格的水平跨度　33
3.3.5　设置单元格的垂直跨度　34
3.3.6　设置单元格的背景色　35
3.3.7　设置单元格的背景图片　35
3.4　表头标记<th>属性　35
3.5　表格的结构标记　36
3.5.1　设置表首样式　36
3.5.2　设置表主体样式　37
3.5.3　设置表尾样式　38
3.6　综合实例——制作一份个人简历　38
知识点提炼　42
习题　42
实验：使用Dreamweaver创建乘法口诀表　42
实验目的　42
实验内容　42
实验步骤　42

第4章　表单的使用　45
4.1　什么是表单　45
4.2　表单标记<form>　45
4.2.1　处理程序action属性　46
4.2.2　表单名称name属性　46
4.2.3　提交方式method属性　46
4.2.4　编码方式enctype属性　46
4.2.5　目标显示方式target属性　47
4.3　输入标记<input>　47
4.3.1　文本域text　48
4.3.2　密码域password　48
4.3.3　单选框radio　49
4.3.4　复选框checkbox　49
4.3.5　普通按钮button　50
4.3.6　提交按钮submit　50
4.3.7　重置按钮reset　50
4.3.8　图像域image　51
4.3.9　隐藏域hidden　52
4.3.10　文件域file　52
4.4　文本区域标记<textarea>　53
4.5　菜单和列表标记<select>，<option>　53
4.6　综合实例——制作注册页面　54
知识点提炼　56
习题　57
实验：制作用户登录页面　57
实验目的　57
实验内容　57
实验步骤　57

第5章　图形图像处理技术　59
5.1　Canvas的基础知识　59
5.1.1　Canvas是什么　59
5.1.2　Canvas元素的基本用法　60
5.1.3　绘制带边框矩形　61
5.2　在画布中使用路径　62
5.2.1　使用arc方法绘制圆形　62
5.2.2　使用moveTo与lineTo路径绘制火柴人　63
5.2.3　贝塞尔和二次方曲线　64
5.3　运用样式与颜色　66
5.3.1　fillStyle和strokeStyle属性　66
5.3.2　透明度 globalAlpha　67
5.3.3　线型 Line styles　68
5.4　绘制渐变图形　70
5.4.1　绘制线性渐变　70
5.4.2　绘制径向渐变　71
5.5　组合多个图形　72
5.6　给图形绘制阴影　73
5.7　图像的应用　74
5.7.1　图像的局部放大　74
5.7.2　图像平铺　75
5.7.3　图像裁剪　76
5.7.4　像素的处理　77
5.8　绘制文字　78
5.9　保存与恢复状态　79
5.10　文件的保存　80
5.11　综合实例——绘制五角星　80
知识点提炼　81
习题　81
实验：制作大头贴边框　82
实验目的　82
实验内容　82
实验步骤　82

第6章　多媒体播放技术　83
6.1　HTML多媒体概述　83
6.1.1　<object>和<embed>元素　83
6.1.2　video与audio元素　84
6.2　多媒体元素基本属性　85
6.3　多媒体元素常用方法　88
6.3.1　媒体播放时的方法　88
6.3.2　canPlayType(type)方法　89
6.4　多媒体元素重要事件　90
6.4.1　事件处理方式　90
6.4.2　事件介绍　90
6.4.3　事件示例　91
6.5　综合实例——在HTML文档中播放音频　93
知识点提炼　94
习题　94
实验：在HTML文档中播放视频　95
实验目的　95
实验内容　95
实验步骤　95

第7章　HTML高应　96
7.1　WebSQL数据库基础　96
7.1.1　打开与创建数据库　96
7.1.2　执行事务　97
7.1.3　插入数据　97
7.1.4　数据管理　98
7.2　本地缓存的更新及状态检测　100
7.2.1　updateready事件　100
7.2.2　update方法　101
7.2.3　swapCache方法　102
7.2.4　更新本地缓存时触发的其他事件　102
7.3　检测在线状态　104
7.3.1　navigator.onLine属性　104
7.3.2　online与offline事件　105
7.3.3　离线数据交互应用开发过程　105
7.4　使用Web Workers处理线程　106
7.4.1　创建和使用Worker　106
7.4.2　单层嵌套　106
7.4.3　在多个子线程中进行数据的交互　108
7.5　综合实例——应用本地数据库创建留言本　109
知识点提炼　111
习题　111
实验：通过传递JSON对象输出用户信息　111
实验目的　111
实验内容　112
实验步骤　112

第8章　CSS概述　113
8.1　CSS发展概述　113
8.2　CSS模块化简介　114
8.3　主流浏览器对CSS的支持　115
8.4　一个简单的CSS示例　116
8.5　综合实例——用CSS 控制登录页面样式　117
知识点提炼　118
习题　118
实验：使用CSS样式添加图像边框　118
实验目的　118
实验内容　119
实验步骤　119

第9章　CSS中的选择器　120
9.1　选择器概述　120
9.2　属性选择器　121
9.2.1　属性选择器是什么　121
9.2.2　灵活运用属性选择器　123
9.3　伪类选择器及伪元素　124
9.3.1　伪类选择器　124
9.3.2　伪元素选择器　124
9.4　通用兄弟元素选择器　127
9.5　综合实例——随机改变页面的背景色　128
知识点提炼　129
习题　129
实验：设计隔行换色的表格　129
实验目的　129
实验内容　130
实验步骤　130

第 10章　CSS常用属性　132
10.1　text-shadow属性　132
10.1.1　text-shadow属性的使用方法　132
10.1.2　指定多个阴影　133
10.2　文本相关属性　134
10.2.1　文本自动换行：word-break　134
10.2.2　长单词和URL地址换行　135
10.3　背景相关属性　136
10.3.1　设置背景颜色　136
10.3.2　设置背景图片　137
10.4　边框相关属性　140
10.4.1　设置边框的线宽　140
10.4.2　设置边框的样式　141
10.4.3　设置边框的颜色　143
10.5　内外边距的相关属性　144
10.5.1　设置内边距　144
10.5.2　设置外边距　145
10.6　尺寸相关属性　146
10.6.1　设置对象的宽度　146
10.6.2　设置对象的高度　147
10.7　定位相关属性　149
10.7.1　设置定位方式　149
10.7.2　设置层叠顺序　150
10.7.3　设置与其父对象的上、下、左、右边的距离　150
10.8　表格相关属性　152
10.8.1　设置表格边框线的显示方式　153
10.8.2　设置单元格边框间距　154
10.8.3　设置表格标题位于表格的什么位置　155
10.8.4　设置表格布局的方式　156
10.9　综合实例——设计隔行变色的单线表格　157
知识点提炼　158
习题　159
实验：让多个字条层叠显示　159
实验目的　159
实验内容　159
实验步骤　159

第 11章　CSS中的变形与动画　161
11.1　2D变换　161
11.1.1　应用transform属性实现平移　162
11.1.2　应用transform属性实现缩放　163
11.1.3　应用transform属性实现倾斜　165
11.1.4　应用transform属性实现旋转　166
11.1.5　更改变换的中心点　167
11.2　过渡效果　169
11.2.1　指定过渡持续的时间　169
11.2.2　指定参与过渡的属性　170
11.2.3　指定过渡的动画类型　172
11.2.4　指定过渡的延迟时间　174
11.3　Animation动画　175
11.3.1　关键帧　176
11.3.2　动画属性　177
11.4　综合实例——模拟进度条效果　179
知识点提炼　180
习题　181
实验：实现方形变圆形动画效果　181
实验目的　181
实验内容　181
实验步骤　181

第 12章　JavaScript概述　183
12.1　JavaScript概貌　183
12.1.1　JavaScript的历史起源　183
12.1.2　JavaScript的主要特点　184
12.1.3　JavaScript成功案例　184
12.2　搭建JavaScript开发环境　186
12.2.1　硬件要求　186
12.2.2　软件要求　186
12.2.3　浏览器对JavaScript的支持　186
12.3　编写JavaScript的工具　187
12.3.1　Adobe Dreamweaver　188
12.3.2　Microsoft FrontPage　188
12.4　JavaScript在HTML中的使用　188
12.4.1　在页面中直接嵌入JavaScript　189
12.4.2　链接外部JavaScript　189
12.5　综合实例——用JS输出中文字符串　190
知识点提炼　191
习题　191
实验：使用Dreamweaver创建JS文件　191
实验目的　191
实验内容　191
实验步骤　191

第 13章　JavaScript语言基础　193
13.1　JavaScript语法前奏　193
13.1.1　执行顺序　193
13.1.2　大小写敏感　194
13.1.3　每行结尾的分号可有可无　194
13.2　常用的几种JavaScript数据结构　194
13.2.1　标识符　194
13.2.2　关键字　195
13.2.3　**常程序元素之一——常量　195
13.2.4　**常程序元素之二——变量　195
13.3　数据是如何分类的——数据类型　197
13.3.1　数字型数据　197
13.3.2　字符串型　198
13.3.3　布尔型　199
13.3.4　特殊数据类型　200
13.4　运算符　201
13.4.1　算术运算符　201
13.4.2　比较运算符　201
13.4.3　赋值运算符　202
13.4.4　字符串运算符　203
13.4.5　布尔运算符　203
13.4.6　条件运算符　204
13.4.7　其他运算符　204
13.4.8　运算符优先级　205
13.5　JavaScript流程控制语句　206
13.5.1　**简单的赋值语句　206
13.5.2　条件控制语句　206
13.5.3　循环控制语句　210
13.6　字符串处理技术　213
13.6.1　match方法　213
13.6.2　search方法　214
13.6.3　replace方法　214
13.6.4　split方法　214
13.7　JavaScript中的数组对象　215
13.7.1　Array对象概述　215
13.7.2　常见的几种数组操作　217
13.8　综合实例——使用数组存储商品信息　219
知识点提炼　219
习题　220
实验：将数字格式化为指定长度　220
实验目的　220
实验内容　220
实验步骤　220

第 14章　函数及其使用　222
14.1　函数的定义　222
14.2　函数的调用　223
14.2.1　函数的简单调用　223
14.2.2　在事件响应中调用函数　224
14.2.3　通过链接调用函数　224
14.2.4　函数参数的使用　224
14.2.5　使用函数的返回值　225
14.3　几种特殊的函数　226
14.3.1　Function构造函数与函数直接量　226
14.3.2　JavaScript中的内置函数　226
14.3.3　嵌套函数的使用　228
14.3.4　递归函数的使用　229
14.4　综合实例——显示系统时间　230
知识点提炼　231
习题　231
实验：将长数字分位显示　231
实验目的　231
实验内容　232
实验步骤　232

第 15章　JavaScript对象编程　233
15.1　Window窗口对象　233
15.1.1　Window对象　233
15.1.2　对话框(Dialog)　235
15.1.3　窗口对象常用操作　237
15.2　Document文档对象　244
15.2.1　文档对象概述　244
15.2.2　文档对象的常用属性、方法与事件　244
15.2.3　Document对象的应用　246
15.3　JavaScript与表单操作　251
15.3.1　在JavaScript中访问表单　251
15.3.2　在JavaScript中访问表单域　251
15.3.3　表单的验证　251
15.4　DOM对象　253
15.4.1　DOM概述　253
15.4.2　DOM对象节点属性　255
15.4.3　节点的几种操作　258
15.4.4　获取文档中的指定元素　264
15.4.5　与DHTML相对应的DOM　265
15.5　综合实例——通过JS操作XML实现分页　267
知识点提炼　268
习题　269
实验：动态设置网页的标题栏　269
实验目的　269
实验内容　269
实验步骤　269

第 16章　JavaScript中的事件
处理　270
16.1　事件与事件处理概述　270
16.1.1　事件与事件名称　270
16.1.2　JavaScript的常用事件　271
16.1.3　事件处理程序的调用　272
16.2　DOM事件模型　273
16.2.1　事件流　273
16.2.2　主流浏览器的事件模型　274
16.2.3　事件对象　274
16.2.4　注册与移除事件监听器　275
16.3　鼠标键盘事件　276
16.3.1　鼠标的单击事件　276
16.3.2　鼠标的按下或松开事件　277
16.3.3　鼠标的移入移出事件　278
16.3.4　鼠标的移动事件　279
16.3.5　键盘事件的使用　279
16.4　页面事件　281
16.4.1　加载与卸载事件　281
16.4.2　页面大小事件　282
16.5　表单事件　283
16.5.1　获得焦点与失去焦点事件　283
16.5.2　失去焦点修改事件　284
16.5.3　表单提交与重置事件　284
16.6　综合实例——限制文本框的输入　287
知识点提炼　287
习题　288
实验：屏蔽键盘相关事件　288
实验目的　288
实验内容　288
实验步骤　288

第 17章　JavaScript高应　290
17.1　创建和使用Cookie　290
17.1.1　Cookie的常用属性　290
17.1.2　Cookie的传递流程　291
17.1.3　如何对Cookie进行读写　291
17.1.4　Cookie的安全问题　295
17.2　JavaScript中的图像处理　295
17.2.1　图像处理对象——Image对象　295
17.2.2　JavaScript中的图像应用　296
17.3　嵌入式插件的使用　300
17.3.1　object嵌入对象标记概述　300
17.3.2　在网页中使用Flash动画　301
17.4　文件处理及页面打印　303
17.4.1　文件处理对象　303
17.4.2　页面打印　311
17.5　综合实例——将页面中的表格导出到Word并打印　317
知识点提炼　319
习题　319
实验：无间断的图片滚动效果　319
实验目的　319
实验内容　319
实验步骤　319

第 18章　Ajax技术的使用　321
18.1　Ajax成功案例　321
18.1.1　百度搜索提示　321
18.1.2　淘宝新会员免费注册　322
18.1.3　明日科技编程词典服务网　322
18.2　Ajax开发模式与传统开发模式的比较　323
18.3　Ajax技术特点　324
18.4　Ajax使用的技术　324
18.4.1　XMLHttpRequest对象　324
18.4.2　XML　324
18.4.3　JavaScript　325
18.4.4　CSS　325
18.4.5　DOM　325
18.5　XMLHttpRequest对象　325
18.5.1　初始化XMLHttpRequest对象　325
18.5.2　XMLHttpRequest对象的常用属性　326
18.5.3　XMLHttpRequest对象的常用方法　328
18.6　Ajax的重构　332
18.6.1　Ajax重构的步骤　332
18.6.2　实时显示商城公告　334
18.7　综合实例——多级联动下拉列表　335
知识点提炼　337
习题　337
实验：显示上传进度条　337
实验目的　337
实验内容　337
实验步骤　337

第 19章　jQuery技术　341
19.1　jQuery概述　341
19.1.1　jQuery能做什么　341
19.1.2　jQuery的特点　343
19.2　jQuery下载与配置　343
19.2.1　下载jQuery　344
19.2.2　配置jQuery　344
19.3　jQuery的插件　345
19.3.1　插件的使用　345
19.3.2　流行的插件　345
19.4　jQuery选择器　347
19.4.1　jQuery的工厂函数　347
19.4.2　基本选择器　347
19.4.3　层级选择器　352
19.4.4　过滤选择器　357
19.4.5　表单选择器　362
19.5　jQuery控制页面　364
19.5.1　对元素内容和值进行操作　364
19.5.2　对DOM节点进行操作　366
19.5.3　对元素属性进行操作　369
19.5.4　对元素的CSS样式操作　369
19.6　jQuery的事件处理　370
19.6.1　页面加载响应事件　371
19.6.2　jQuery中的事件　371
19.6.3　事件绑定　373
19.6.4　模拟用户操作　373
19.7　jQuery的动画效果　375
19.7.1　基本的动画效果　375
19.7.2　淡入淡出的动画效果　377
19.7.3　滑动效果　378
19.7.4　自定义的动画效果　380
19.8　综合实例——隔行换色并且鼠标指向行变色的表格　381
知识点提炼　383
习题　383
实验：实现图片传送带　383
实验目的　383
实验内容　384
实验步骤　384

第 20章　综合案例——企业门户网站　387
20.1　概述　387
20.2　系统设计　387
20.2.1　系统目标　387
20.2.2　系统功能结构　388
20.2.3　网页预览　388
20.3　关键技术　390
20.3.1　JavaScript脚本操作　391
20.3.2　jQuery技术　393
20.3.3　Ajax无刷新技术　394
20.4　系统主要模块开发　398
20.4.1　使用JavaScript技术实现导航菜单设计　398
20.4.2　使用jQuery技术实现图片展示区　400
20.4.3　使用Ajax技术实现**新消息页面　402
20.4.4　使用JavaScript脚本实现产品推荐页面　404
20.4.5　使用JavaScript脚本实现浮动窗口设计　405
20.5　小结　407

第 21章　课程设计——旅游网站前台　408
21.1　课程设计目的　408
21.2　功能描述　408
21.3　网站总体设计　408
21.3.1　构建开发环境　408
21.3.2　网站功能结构　409
21.4　实现过程　409
21.4.1　设计网站公共header　409
21.4.2　设计网站公共footer　415
21.4.3　显示网站介绍及相关图片　416
21.4.4　主页左侧导航的实现　418
21.4.5　播放音乐　420
21.4.6　添加留言功能的实现　421
21.5　课程设计总结　422