巧学巧用HTML CSS JavaScript制作网页

第一部分 HTML
第1章 从零起步 1
1.1 网络的基本概念 1
1.2 网页概述 3
1.2.1 网页技术 3
1.2.2 网页分类 3
1.3 HTML简介 3
1.3.1 什么是HTML 4
1.3.2 创建第一个HTML文件 4
1.3.3 HTML文件结构 7
1.3.4 热身运动 8
实例1.1 注释标记 9
实例1.2 标题标记 9
实例1.3 设置文字颜色 10
实例1.4 蓝色粗斜字体 11
实例1.5 插入图片标记 12
1.4 网页源文件的获取 12
1.4.1 直接查看源文件 13
1.4.2 保存网页 13
第2章 HTML文件中文字的使用 15
2.1 对文字的编排 15
2.1.1 文字排版的简单操作 15
实例2.1 文字的普通显示 15
实例2.2 HTML编排标记的加入 16
2.1.2 文字单行显示 17
实例2.3 不换行标记的使用 17
2.1.3 文字居中显示 18
实例2.4 所有文字居中显示 18
2.1.4 文字段落的缩进 19
实例2.5 文字段落的缩进 19
2.1.5 文字内容的原始版面显示 20
实例2.6 原始版面 20
2.1.6 标记属性的应用 21
实例2.7 段落的居中对齐 21
实例2.8 标题文字的位置控制 22
实例2.9 body 标记中的设置背景图片属性 23
实例2.10 水平分割线标记及其相关属性 24
实例2.11 noshade属性的使用 25
实例2.12 属性的就近原则 26
2.2 多种多样的网页文字 27
2.2.1 不同的文字格式 27
实例2.13 文字字体样式、颜色的设置 27
2.2.2 对文字格式的进一步应用 28
实例2.14 多种特定显示方式的HTML标记的综合使用 28
2.2.3 关于技术专业符号的显示 30
实例2.15 特殊字符的应用 30
实例2.16 上、下标标记的使用 30
2.2.4 滚动字幕 31
实例2.17 滚动字幕的制作 31
2.3 文字列表的使用 33
2.3.1 序列提纲 33
实例2.18 编号列表的制作 33
实例2.19 改变编号序号 34
实例2.20 从特定序号开始 35
2.3.2 非序列提纲 36
实例2.21 非编号列表的制作 36
实例2.22 改变标号样式 37
实例2.23 3种不同非编号列表的比较 38
2.3.3 说明式列表标记 39
实例2.24 说明式列表标记的使用 39
2.3.4 列表标记之间的套用 40
实例2.25 标记间的相互套用 41
第3章 HTML文件中图片的使用 43
3.1 网页中的图片格式 43
3.2 绚丽多姿的网页 43
3.2.1 一个简单的图片网页 43
实例3.1 图片的插入 44
3.2.2 图片标记属性的应用 45
实例3.2 图片宽度和高度的控制 45
实例3.3 图片边框的控制 46
3.2.3 图片与文字的结合 47
实例3.4 控制图片左右的空白区域大小 47
实例3.5 控制图片上下的空白区域大小 48
实例3.6 控制文字相对于图片基线居于上、中、下的位置 49
实例3.7 无align属性控制的情况下让文字分别显示于图片的左右
两侧 50
实例3.8 文字相对图片居右显示 51
实例3.9 文字相对图片居左显示 52
3.2.4 优化图片的显示速度 52
实例3.10 低分辨率显示图片 53
实例3.11 文字代替图片的显示 53
3.2.5 图片的滚动 55
实例3.12 图片从右到左滚动显示的制作 55
实例3.13 图片两端来回滚动显示的制作 56
3.3 实战 56
实例3.14 一个简单网页的制作 57
第4章 超链接的建立 59
4.1 老马未必识途 59
4.1.1 路径问题的引出 59
实例4.1 一个普通的图片网页 59
4.1.2 相对路径和绝对路径的应用 60
4.2 超链接的建立 62
4.2.1 文字的超链接 62
实例4.2 文字超链接的建立 62
4.2.2 能表达点击与否信息的超链接 63
实例4.3 文字链接颜色的设置 63
4.2.3 特定目标的链接 64
实例4.4 特定目标的链接 64
4.2.4 图片的超链接 66
实例4.5 图片超链接的建立 66
4.2.5 热点区域 67
实例4.6 圆形热点区域的制作 67
实例4.7 矩形热点区域的制作 68
实例4.8 多边形热点区域的制作 69
4.2.6 以新窗口显示链接页面 69
实例4.9 打开新窗口 69
4.3 超链接的其他应用 70
4.3.1 URL地址的链接 70
实例4.10 HTTP协议的链接 70
实例4.11 FTP站点的链接 71
实例4.12 BBS站点的链接 72
4.3.2 电子邮件的链接制作 73
实例4.13 邮件的链接 73
4.4 网页的自动更新 73
实例4.14 网页自动更新链接 73
4.5 Dreamweaver中超链接的建立 74
4.5.1 Dreamweaver简介 74
4.5.2 使用Dreamweaver打开一个HTML文档 75
4.5.3 在Dreamweaver中新建一个文档 76
4.5.4 图片的插入 76
4.5.5 超链接的建立 77
4.5.6 使用Dreamweaver来制作图片的热点区域 78
第5章 表格的应用 81
5.1 表格的建立 81
5.1.1 一个最简单的表格 81
实例5.1 一个最简单的表格 81
5.1.2 多单元表格 82
实例5.2 创建3行2列的表格 82
5.2 各种表格样式 83
5.2.1 表格边框的设置 83
实例5.3 表格边框的设置 83
5.2.2 表格高宽的控制 84
实例5.4 表格高宽的设置 84
5.2.3 表格相关颜色的设置 85
实例5.5 表格边框以及背景颜色的设置 85
5.2.4 表格的水平位置 86
实例5.6 表格水平位置的控制 86
5.2.5 表格行的控制 87
实例5.7 表格单行高度的设置 88
实例5.8 利用align属性控制每一行中内容的水平位置 89
实例5.9 利用valign属性控制每一行中内容的垂直位置 90
5.2.6 单元格的设置 91
实例5.10 分别设置表格单元格的边框以及背景颜色 91
实例5.11 利用align、valign属性控制每一单元格中内容的水平和
垂直位置 92
5.2.7 标题标记 93
实例5.12 为表格设置名称和表格内容以标题文字进行显示 93
5.2.8 表格中单元格的合并 94
实例5.13 水平合并相邻的两个单元格 94
实例5.14 垂直合并相邻的3个单元格 95
实例5.15 水平、垂直合并单元格的混合使用 97
5.2.9 表格中图片的应用 98
实例5.16 在单元格中插入图片以及设置单元格的背景图像 98
5.2.10 表格的嵌套 99
实例5.17 表格的嵌套 99
5.3 利用表格来布局网页 100
实例5.18 使用表格布局网页 102
5.4 在Dreamweaver中表格的使用 103
5.4.1 Dreamweaver中表格的创建 103
5.4.2 空字符的自动生成 105
实例5.19 空字符的存在 105
5.4.3 表格的属性设置 107
5.5 实战 110
5.5.1 网页的初步设计 111
5.5.2 切片的制作 111
5.5.3 表格的制作 113
5.6 网页布局视图 115
5.6.1 布局视图的切换 115
5.6.2 布局视图的创建 116
5.6.3 布局表格的修改 116
5.6.4 布局视图的属性设置 117
5.6.5 布局视图的实际应用 118
5.7 图层技术 120
5.7.1 图层的创建 120
5.7.2 创建嵌套层 121
5.7.3 层的属性设置 121
5.7.4 层的状态显示 122
5.7.5 图层的实际应用 122
5.7.6 层与表格的互换 123
第6章 窗口框架的应用 125
6.1 网页中的网页 125
6.1.1 窗口框架的建立 125
实例6.1 将窗口水平分为两部分 125
实例6.2 将窗口垂直分为三部分 126
实例6.3 窗口的水平及垂直混合分割 127
6.1.2 子窗口的边框设置 128
实例6.4 将窗口边框加粗 128
实例6.5 隐藏所有边框 129
实例6.6 隐藏子窗口边框 129
6.1.3 子窗口的设置 130
实例6.7 在子窗口中插入网页 130
6.1.4 窗口滚动条的设置 131
实例6.8 在右子窗口中不显示滚动条 131
6.1.5 窗口边框的拖动 131
6.1.6 窗口的导航显示 132
实例6.9 在子窗口中加入显示导航信息的网页 132
实例6.10 在上层窗口中显示网页 133
6.2 神奇的iframe标记 135
6.2.1 iframe窗口 135
实例6.11 在iframe窗口中显示所链接的网页 135
6.2.2 直接设置网页 136
实例6.12 在iframe窗口中直接显示网页 136
6.2.3 引用多媒体文件 137
实例6.13 在iframe窗口中播放Flash电影文件 137
6.3 在Dreamweaver中创建窗口框架 138
6.3.1 窗口框架的创建 138
6.3.2 混合窗口的创建 139
6.3.3 框架属性的设置 141
6.3.4 使用Dreamweaver在子窗口中插入网页 141
第7章 HTML中多媒体文件的使用 145
7.1 多媒体的链接 145
实例7.1 音乐文件以及影视文件的链接 145
7.2 将多媒体嵌入网页 146
实例7.2 音乐文件的嵌入 146
实例7.3 影视文件的嵌入 147
7.3 在网页中加入背景音乐 148
实例7.4 网页背景音乐的制作 148
7.4 其他多媒体文件的插入 149
7.4.1 Flash电影文件的插入 149
7.4.2 Flash按钮的制作 151
7.4.3 Flash文本的制作 152
第二部分 CSS
第8章 CSS初步 153
8.1 CSS的概念 153
8.2 CSS的应用 153
8.2.1 CSS的优点 154
8.2.2 热身运动 154
实例8.1 CSS的样式声明 154
实例8.2 CSS样式的选择性使用 155
第9章 文字的设置 159
9.1 尺度单位 159
9.2 掌控文字 160
9.2.1 文字的字体设置 160
实例9.1 同时设置多种字体 160
9.2.2 文字的字体效果 161
实例9.2 设置斜体样式 161
9.2.3 文字的粗细控制 162
实例9.3 控制文字的粗细 162
9.2.4 文字的大小控制 163
实例9.4 控制文字的大小 164
实例9.5 设置粗斜体样式 165
9.2.5 文字的加线效果 166
实例9.6 文字的加线效果 166
9.2.6 英文字母的大小写转换 167
实例9.7 英文字母大小写的相互转换 167
实例9.8 小写字母转换为大写字母 168
9.3 精细排版 169
9.3.1 段落的首行缩进 169
实例9.9 控制首行缩进 169
实例9.10 控制首行凸出 170
9.3.2 字符间距 171
实例9.11 控制字符间距 171
9.3.3 段落行距 172
实例9.12 控制段落行距 172
9.3.4 段落的位置控制 173
实例9.13 控制段落水平位置 173
实例9.14 控制段落垂直位置 175
实例9.15 化学方程式和数学式 176
9.4 矩形模块化 177
9.4.1 立体按钮的制作 177
实例9.16 立体按钮 177
9.4.2 模块边界的设置 178
实例9.17 分别设置模块周围的空白区域 178
实例9.18 统一设置模块周围的空白区域 179
9.4.3 模块边框的设置 179
实例9.19 模块边框宽度的设置 180
实例9.20 模块边框颜色的设置 181
实例9.21 模块边框样式的设置 183
实例9.22 模块边框的统一设置 184
9.4.4 模块内边界的设置 185
实例9.23 设置模块边界与模块内容的间距 185
9.5 列表中的图像符号 186
实例9.24 图像符号 186
实例9.25 设置各种序列符号 187
第10章 背景的设置 189
10.1 颜色的设置方法扩充 189
10.1.1 以颜色名称设置 189
10.1.2 以十六进制数设置 189
10.1.3 以RGB函数设置 190
10.2 背景颜色的设置 190
10.2.1 文字的颜色设置 190
实例10.1 红色的文字 190
10.2.2 网页以及文字背景颜色的设置 191
实例10.2 红色的网页背景，黄色的文字背景 191
10.3 背景图片的设置 192
10.3.1 网页以及文字的图片背景设置 192
实例10.3 设置网页的图片背景以及文字的图片背景 192
10.3.2 背景图片的并排设置 193
实例10.4 背景图片的横向平铺 193
实例10.5 背景图片的纵向平铺 194
实例10.6 只显示单个背景图片 194
10.3.3 图片的固定设置 195
实例10.7 固定背景图片 195
10.3.4 图片的定位设置 196
实例10.8 控制背景图片的位置 197
第11章 美化网页 199
11.1 超链接的多样化 199
11.1.1 链接颜色的设置 199
实例11.1 链接颜色的设置 199
11.1.2 链接字体的变化 200
实例11.2 链接字体的变化 200
11.1.3 链接的下划线设置 201
实例11.3 去除链接文字的下划线 201
11.2 华丽的滚动条 202
实例11.4 立体滚动条的制作 202
11.3 代表不同意义的光标样式 203
实例11.5 变换光标样式 203
第12章 区域与层的概念 207
12.1 区域的概念 207
12.1.1 区域的定义 207
实例12.1 制作3个相邻的区域 207
12.1.2 区域的定位 208
实例12.2 区域的定位 208
实例12.3 区域的相对位置 209
实例12.4 区域的默认位置 210
12.2 网页中组件的分段管理 211
实例12.5 分段显示不同的文字字体 211
实例12.6 分段显示不同的文字背景 213
12.3 层的概念 214
实例12.7 区域的重叠 215
实例12.8 改变区域的重叠顺序 216
12.3.1 三维空间的建立 217
实例12.9 图片和文字的层次建立 217
12.3.2 文字的立体以及阴影效果 218
实例12.10 文字的立体效果 218
实例12.11 文字的阴影效果 219
第13章 CSS与HTML的结合方式 221
13.1 HTML的内部定义 221
13.1.1 在HTML标记内的直接定义 221
实例13.1 在标记内直接定义 221
13.1.2 对HTML标记的直接定义 222
实例13.2 对标记直接定义 222
13.1.3 利用class属性的选择性定义 223
实例13.3 class属性的选择性定义 223
13.1.4 利用id属性的选择性定义 224
实例13.4 id属性的选择性定义 224
13.1.5 结构化定义 225
实例13.5 结构化定义 225
13.2 HTML的外部定义 226
实例13.6 以嵌入方式调用CSS文件 226
实例13.7 以链接方式调用CSS文件 227
13.3 CSS的调用顺序 228
实例13.8 CSS的调用顺序 228
13.4 CSS中的继承性质 229
13.4.1 标记中的包含继承 229
实例13.9 包含继承 230
实例13.10 定义冲突 230
13.4.2 标记中的相互继承 231
实例13.11 上下选择符 231
实例13.12 一次定义三组标记 232
13.5 在Dreamweaver中使用CSS 233
13.5.1 调用自定义的样式表 233
13.5.2 编辑CSS样式表 234
13.5.3 创建CSS样式表 235
13.5.4 在Dreamweaver中使用CSS样式 236
第14章 CSS中的滤镜 237
14.1 什么是滤镜 237
14.2 带有滤镜效果的图片网页 237
14.2.1 alpha滤镜 237
实例14.1 圆形透明渐层效果 238
实例14.2 矩形透明渐层效果 239
实例14.3 多参数的混合使用 240
14.2.2 blur滤镜 241
实例14.4 动态模糊效果 241
14.2.3 filph滤镜和filpv滤镜 242
实例14.5 翻转图片 243
14.2.4 gray滤镜 244
实例14.6 黑白图片 244
14.2.5 invert滤镜 245
实例14.7 底片效果 245
14.2.6 xrey滤镜 246
实例14.8 X光效果 246
实例14.9 黑白效果、底片效果、X光效果的相互比较 247
14.2.7 波浪效果 248
实例14.10 波浪效果 248
14.2.8 chroma滤镜 249
实例14.11 设置透明色 249
14.2.9 dropshadow滤镜 250
实例14.12 阴影效果 250
14.2.10 glow、mask和shadow滤镜 251
实例14.13 光晕效果 252
实例14.14 印章效果 253
实例14.15 阴影动态效果 254
14.3 滤镜的转换 255
14.3.1 渐变转化滤镜 255
实例14.16 控制文字、图片的显示 256
实例14.17 控制文字、图片的转换 258
实例14.18 控制文字和图片的相互转换 260
14.3.2 动作转换滤镜 261
实例14.19 设置文字、图片的动作转换效果 262
实例14.20 设置文字、图片相互转换的动作效果 264
实例14.21 网页的动作转换效果 265
第三部分 JavaScript
第15章 JavaScript初识 269
15.1 JavaScript的基本概念 269
15.1.1 JavaScript语言的特点 269
实例15.1 问候语句 270
实例15.2 调用JavaScript文件 271
15.1.2 JavaScript的数据结构 272
实例15.3 使用while语句制作标题文字 275
实例15.4 使用for语句制作标题文字 276
实例15.5 图像的交叉显示 277
实例15.6 显示不同的文字 278
15.2 JavaScript中函数的使用 279
15.2.1 有参函数 279
实例15.7 斜杆的递加 279
15.2.2 无参函数 280
实例15.8 当前时间的获取 280
15.3 JavaScript中的对象 281
实例15.9 个人信息的设置 282
15.4 行为 284
15.4.1 JavaScript中的行为 284
实例15.10 弹出新窗口 285
实例15.11 屏蔽对图片的操作 286
实例15.12 全屏显示窗口 287
15.4.2 Dreamweaver中行为的应用 287
第16章 JavaScript中的时间对象 291
16.1 时间对象的方法 291
16.2 时间对象的实际应用 292
16.2.1 时间的显示 292
实例16.1 显示当前时间 292
16.2.2 日期的显示 294
实例16.2 显示当前日期 294
16.2.3 进站及停留时间的显示 295
实例16.3 显示停留时间 295
16.2.4 倒计时的制作 297
实例16.4 以2005年元月1日为基准倒计时 297
第17章 JavaScript中的文字对象 301
17.1 文字对象的属性和方法 301
17.2 文字对象的实际应用 302
17.2.1 计算字符串长度 302
实例17.1 计算字符串长度 302
17.2.2 string对象其他方法的应用 303
实例17.2 其他方法的应用 303
17.2.3 字符的检索以及替换 305
实例17.3 字符的检索以及替换 305
第18章 JavaScript中的图片应用 309
18.1 图像对象的属性 309
18.2 图像对象的实际应用 309
18.2.1 滤镜的动态效果 310
实例18.1 alpha滤镜的动态效果 310
实例18.2 wave滤镜的动态效果 311
18.2.2 图片的闪烁效果 312
实例18.3 图片的闪烁效果 312
18.2.3 数组的使用 313
实例18.4 图片的自动切换 313
18.2.4 图片的预先载入 315
第19章 JavaScript在表单中的应用 317
19.1 表单总览 317
19.1.1 单行文本框 317
实例19.1 一个输入框 317
19.1.2 密码文本框 318
实例19.2 一个密码框 318
19.1.3 单选框 319
实例19.3 两个单选框 319
19.1.4 复选框 320
实例19.4 多个复选框 320
19.1.5 传送按钮和清除按钮 321
实例19.5 传送按钮和清除按钮 321
19.1.6 图片按钮 322
实例19.6 图片按钮 322
19.1.7 按钮 322
实例19.7 普通按钮的制作 322
19.1.8 下拉列表框 323
实例19.8 下拉列表框 323
实例19.9 列表选项平铺 324
19.1.9 多行文本框 325
实例19.10 多行文本框 325
19.2 表单的实际应用 326
19.2.1 计算器的制作 326
实例19.11 计算器的制作 326
19.2.2 通过数组访问菜单 329
实例19.12 注册信息的统一显示 329
19.2.3 表单数据的检测 331
实例19.13 信息检测 331
第20章 JavaScript中窗口对象的应用 335
20.1 窗口对象的方法 335
20.2 窗口对象的实际应用 336
20.2.1 打开新窗口 336
实例20.1 打开新窗口 336
实例20.2 在打开的新窗口中只加入状态栏 337
20.2.2 打开多个新窗口 338
实例20.3 打开3个不同的窗口 338
20.2.3 全屏显示 339
实例20.4 全屏显示 339
实例20.5 窗口的定位 340
实例20.6 无标题栏的全屏显示 341
20.2.4 打开窗口的动态变化 341
实例20.7 打开窗口的动态变化 342
20.2.5 窗口内边框的设置 343
实例20.8 设置窗口内边框为红色实线 343
20.2.6 关闭窗口 344
实例20.9 关闭窗口 344
实例20.10 新窗口的关闭 345
20.2.7 窗口焦点的控制 346
实例20.11 控制窗口的焦点 346
实例20.12 cookie的使用 347
20.2.8 输入和输出对话框的使用 349
实例20.13 进入网站的口令设置 349
第21章 JavaScript中其他对象的应用 353
21.1 浏览器信息的获取 353
实例21.1 浏览器信息 353
实例21.2 判断浏览器类别 354
21.2 网页信息的获取 355
实例21.3 返回、前进按钮 355
实例21.4 链接地址信息 356
21.3 首页和收藏夹的设置 357
实例21.5 设置为首页和加入收藏夹 358
21.4 浏览器状态栏的信息显示 359
实例21.6 状态栏信息显示 359
21.5 随机显示文字 360
实例21.7 随机显示文字 360
21.6 JavaScript脚本 361
21.6.1 静止浮动层的制作 361
21.6.2 跟随鼠标的文字 363
21.6.3 动态下拉菜单的制作 365
附录 网页效果80例 369