简体网页||繁体网页

☆☆☆☆☆

刘西杰，张婷 著

图书标签:

• HTML
• CSS
• JavaScript
• 网页制作
• 前端开发
• Web开发
• 入门
• 精通
• 第3版
• 编程

出版社： 人民邮电出版社

ISBN：9787115425058

版次：3

商品编码：11993156

品牌：异步图书

包装：平装

开本：16开

出版时间：2016-07-01

用纸：胶版纸

页数：437

正文语种：中文

编辑推荐

畅销图书 全新升级
——经久不衰的经典教程震撼升级，诠释网页制作的新技术。
实例典型 轻松易学
——以实例方式讲解理论知识，直观、具体，有助于快速上手。
边学边做 学以致用
——涵盖网页制作中的各类知识，高效解决工作中的实际问题。
配套课件 便于总结
——精心配备了课件和案例文件，便于老师教学以及学生复习。
（配套素材文件及PPT课件请扫描封底左侧二维码进入社区，搜索本书书名即可进去资源下载页面）

内容简介

全书共分为19章和4个附录，重点介绍使用HTML进行网页制作的方方面面，同时讲解了目前流行的Web标准与CSS网页布局实例，以及基于JavaScript语言的网页特效制作，还介绍了新的HTML5和CSS3知识。为了便于读者学习，附录中汇集了经过作者精心整理的网页制作技巧60多例。
本书语言简洁、内容丰富，适合网页设计与制作人员、网站建设与开发人员、大中专院校相关专业师生、网页制作培训班学员、个人网站爱好者阅读。

作者简介

刘西杰 张婷 拥有丰富的网页设计与大型网站建设经验，并讲授相关课程，曾编写畅销书《HTML CSS JavaScript 网页制作从入门到精通》，累计近10万册。

目录

第01章　HTML基础
1．1　HTML的基本概念 2
1．1．1　HTML简介2
1．1．2　HTML文件的基本结构．2
1．1．3　认识HTML标记．2
1．2　HTML文件的编写方法 3
1．2．1　使用记事本手工编写HTML．3
1．2．2　使用Dreamweaver编写HTML文件4
1．3　使用浏览器浏览HTML文件 4
1．3．1　查看页面效果4
1．3．2　查看源文件．5
1．4　练习题 5
第02章　HTML基本标记
2．1　HTML头部标记head 8
2．2　标题标记title． 8
2．3　元信息标记meta 8
2．3．1　设置页面关键字．9
2．3．2　设置页面说明．9
2．3．3　定义编辑工具． 10
2．3．4　设置作者信息． 10
2．3．5　设置网页文字及语言 10
2．3．6　设置网页的定时跳转 11
2．4　页面注释标记．11
2．5　标题字 12
2．5．1　标题字标记h． 12
2．5．2　标题字对齐属性align． 13
2．6　段落标记． 14
2．6．1　段落标记p 14
2．6．2　换行标记br． 15
2．6．3　不换行标记nobr． 16
2．7　水平线 16
2．8　其他标记． 17
2．8．1　插入空格 17
2．8．2　插入特殊符号． 18
2．9　练习题 19
第03章　建立超链接
3．1　超级链接的基本知识． 21
3．1．1　绝对路径． 21
3．1．2　相对路径 21
3．2　内部链接． 21
3．2．1　认识内部链接 21
3．2．2　链接的目标窗口22
3．3．1　建立锚点23
3．3　锚点链接． 23
3．3．2　链接同一页面中的锚点25
3．3．3　链接到其他页面中的锚点．26
3．4　外部链接． 27
3．4．1　链接到外部网站．28
3．4．2　链接到E-mail28
3．4．3　链接到FTP29
3．4．4　链接到Telnet．30
3．4．5　下载文件30
3．5　练习题 32
第04章　使用图像
4．1　图像的格式 34
4．2　插入图像． 34
4．2．1　插入图像标记img34
4．2．2　图像的源文件src35
4．2．3　图像的提示文字alt36
4．2．4　图像的宽度和高度width、height36
4．3　图像的超链接． 37
4．3．1　图像的超链接37
4．3．2　图像热区链接．38
4．4　练习题 41
第05章　使用列表
5．1　认识列表标记 43
5．2　有序列表． 43
5．2．1　有序列表ol43
5．2．2　有序列表的序号类型type．44
5．2．3　有序列表的起始数值start．45
5．3　无序列表． 46
5．3．1　无序列表标记

．47
5．3．2　无序列表的类型type．48
5．3．3　定义列表标记

49
5．3．4　菜单列表标记50
5．4　练习题 51
第06章　使用表格
6．1　创建表格． 53
6．1．1　表格的基本构成table、tr、td．53
6．1．2　设置表格的标题caption．54
6．1．3　表头th55
6．2　表格基本属性． 576．2．1　表格宽度width57
6．2．2　表格高度height58
6．2．3　表格对齐方式align59
6．3　表格的边框 61
6．3．1　表格边框宽度border． 61
6．3．2　表格边框颜色bordercolor．62
6．3．3　内框宽度cellspacing62
6．3．4　表格内文字与边框间距cellpadding63
6．4　表格背景． 64
6．4．1　表格背景颜色bgcolor64
6．4．2　表格背景图像．65
6．5　表格的行属性． 66
6．5．1　高度控制height66
6．5．2　边框颜色bordercolor67
6．5．3　行背景bgcolor、background．68
6．5．4　行文字的水平对齐方式align．69
6．5．5　行文字的垂直对齐方式valign．70
6．6　单元格属性 71
6．6．1　单元格大小width、height 71
6．6．2　水平跨度colspan．72
6．6．3　垂直跨度rowspan73
6．6．4　对齐方式align、valign74
6．6．5　单元格的背景色75
6．6．6　单元格的边框颜色bordercolor．76
6．6．7　单元格的亮边框bordercolorlight．77
6．6．8　单元格的暗边框bordercolordark．78
6．6．9　单元格的背景图像background79
6．7　表格的结构 81
6．7．1　表格的表首标记． 81
6．7．2　表格的表主体标记82
6．7．3　表格的表尾标记．84
6．8　练习题 85
第07章　使用表单
7．1　表单标记form 87
7．1．1　提交表单action．87
7．1．2　表单名称name．87
7．1．3　传送方法method88
7．1．4　编码方式enctype88
7．1．5　目标显示方式target89
7．2　插入表单对象． 89
7．2．1　文字字段text89
7．2．2　密码域password90
7．2．3　单选按钮radio92
7．2．4　复选框checkbox92
7．2．5　普通按钮button93
7．2．6　提交按钮submit．94
7．2．7　重置按钮reset95
7．2．8　图像域image．96
7．2．9　隐藏域hidden97
7．2．10　文件域file．98
7．3　菜单和列表 98
7．3．1　下拉菜单99
7．3．2　列表项． 100
7．4　文本域标记textarea 101
7．5　id标记． 101
7．6　创建表单实例． 102
7．7　练习题 104
第08章　添加多媒体
8．1　设置滚动效果 106
8．1．1　滚动标记marquee 106
8．1．2　滚动方向direction． 106
8．1．3　滚动方式behavior 108
8．1．4　滚动速度scrollamount 108
8．1．5　滚动延迟scrolldelay． 109
8．1．6　滚动循环loop． 110
8．1．7　滚动范围width、height 111
8．1．8　滚动背景颜色bgcolor 112
8．1．9　空白空间hspace、vspace 113
8．2　插入多媒体文件． 114
8．2．1　插入Flash动画． 114
8．2．2　插入音频和视频文件 115
8．3　练习题． 116
第09章　HTML 5入门基础
9．1　认识HTML5． 118
9．2　HTML5与HTML4的区别 119
9．2．1　HTML5的语法变化． 119
9．2．2　HTML 5中的标记方法． 119
9．2．3　HTML 5语法中的3个要点． 120
9．2．4　HTML5与HTML4在搜索引擎优化的
对比 120
9．3　HTML5新增的元素和废除的元素． 121
9．3．1　新增的结构元素． 121
9．3．2　新增块级元素． 123
9．3．3　新增的行内的语义元素 125
9．3．4　新增的嵌入多媒体元素与交互性元素 128
9．3．5　新增的input元素的类型． 129
9．3．6　废除的元素． 131
9．4　新增的属性和废除的属性 131
9．4．1　新增的属性． 131
9．4．2　废除的属性． 132
9．5　练习题 134
第10章　HTML5的结构
10．1　新增的主体结构元素 136
10．1．1　article元素 136
10．1．2　section元素 137
10．1．3　nav元素． 138
10．1．4　aside元素 141
10．2　新增的非主体结构元素． 141
10．2．1　header元素 141
10．2．2　hgroup元素． 142
10．2．3　footer元素． 143
10．2．4　address元素 144
10．3　练习题 145
第11章　HTML5开发实战
11．1　HTML5视频video 148
11．1．1　video标签概述． 148
11．1．2　在网页中添加视频文件 14811．1．3　链接不同的视频文件． 149
11．2　HTML5音频Audio 150
11．2．1　Audio元素简介 150
11．2．2　隐藏audio播放器． 150
11．2．3　使用audio元素的事件 151
11．3　HTML5地理定位． 153
11．3．1　地理定位方法． 153
11．3．2　处理拒绝和错误． 153
11．3．3　在地图上显示你的位置． 155
11．4　HTML5画布canvas． 155
11．4．1　canvas元素 156
11．4．2　基本的绘制操作． 157
11．4．3　线性渐变． 158
11．4．4　径向渐变． 159
11．4．5　绘制精美时钟 160
11．5　HTML5 SVG 163
11．5．1　SVG概述 163
11．5．2　图形绘制． 163
11．5．3　文本与图像． 166
11．5．4　笔画与填充． 166
11．5．5　动画． 167
11．6　练习题． 169
第12章　使用CSS样式表
12．1　认识CSS 171
12．2　使用CSS． 171
12．2．1　CSS的基本语法 171
12．2．2　添加CSS的方法 171
12．3　字体属性． 173
12．3．1　字体font-family 173
12．3．2　字号font-size 174
12．3．3　字体风格font-style． 175
12．3．4　加粗字体font-weight 176
12．3．5　小写字母转为大写font-variant 177
12．3．6　字体复合属性 178
12．4　颜色和背景属性． 179
12．4．1　颜色属性color． 179
12．4．2　背景颜色background-color 180
12．4．3　背景图像background-image 181
12．4．4　背景重复background-repeat． 182
12．4．5　背景附件backgroundattachment
183
12．4．6　背景位置background-position． 184
12．4．7　背景复合属性background． 186
12．5　段落属性． 187
12．5．1　单词间隔word-spacing 187
12．5．2　字符间隔letter-spacing 188
12．5．3　文字修饰text-decoration． 189
12．5．4　垂直对齐方式vertical-align． 190
12．5．5　文本转换text-transform． 191
12．5．6　水平对齐方式text-align 192
12．5．7　文本缩进text-indent． 193
12．5．8　文本行高line-height． 194
12．5．9　处理空白white-space 195
12．5．10　文本反排unicode-bidi、direction． 196
12．6　外边距与内边距属性． 198
12．6．1　上边距margin-top 198
12．6．2　其他边距margin-bottom、
margin-left、margin-right 199
12．6．3　外边距复合属性margin200
12．6．4　顶端内边距padding-top． 201
12．6．5　其他内边距padding-bottom、
padding-right、padding-left 202
12．6．6　内边距复合属性padding203
12．7　边框属性． 204
12．7．1　边框样式border-style．204
12．7．2　边框宽度border-width．206
12．7．3　边框颜色border-color207
12．7．4　边框属性border208
12．8　定位属性． 209
12．8．1　定位方式position209
12．8．2　元素位置top、right、bottom、left．210
12．8．3　层叠顺序z-index 211
12．8．4　浮动属性float． 212
12．8．5　清除属性clear 213
12．8．6　可视区域clip． 214
12．8．7　层的宽度和高度width、height． 215
12．8．8　超出范围overflow． 216
12．8．9　可见属性visibility 217
12．9　列表属性． 218
12．9．1　列表符号list-style-type 218
12．9．2　图像符号list-style-image．220
12．9．3　列表缩进list-style-position 221
12．9．4　列表复合属性list-style222
12．10　光标属性cursor 223
12．11　滤镜属性 224
12．11．1　不透明度alpha．224
12．11．2　动感模糊blur．226
12．11．3　对颜色进行透明处理chroma．227
12．11．4　阴影效果dropShadow．228
12．11．5　对象翻转flipH、flipV229
12．11．6　发光效果glow230
12．11．7　灰度处理gray 231
12．11．8　反相invert．232
12．11．9　X光片效果xray233
12．11．10　遮罩效果mask．234
12．11．11　波形滤镜wave．235
12．12　练习题． 236
第13章　Web标准与CSS网页布局实例
13．1　Web标准与CSS布局． 239
13．1．1　什么是Web标准239
13．1．2　CSS布局的优势239
13．2　DIV+CSS布局网页基础 240
13．2．1　认识DIV．240
13．2．2　一列固定宽度240
13．2．3　一列自适应． 241
13．2．4　两列固定宽度242
13．2．5　两列宽度自适应．243
13．2．6　两列右列宽度自适应244
13．3　使用CSS设计网站导航栏． 245
13．3．1　实现背景变换的导航菜单24513．3．2　利用CSS制作横向导航247
13．4　使用CSS设计表单样式． 248
13．4．1　改变按钮的背景颜色和文字颜色248
13．4．2　设计文本框的样式．249
13．4．3　设计文本框中的文字样式250
13．5　字体及段落样式设计． 251
13．5．1　利用CSS控制字体大小和行距． 251
13．5．2　制作光晕文字效果． 251
13．6　使用CSS设计图片样式． 252
13．6．1　鼠标指针移上时图片渐变的效果252
13．6．2　设计不重复出现的背景．253
13．7　使用CSS控制链接样式． 254
13．7．1　使用CSS实现鼠标指针形状改变．254
13．7．2　鼠标指针移到链接文字上时改变文字
大小或颜色．255
13．8　练习题 256
第14章　移动网页设计基础CSS3
14．1　边框 258
14．1．1　圆角边框border-radius．258
14．1．2　边框图片border-image 261
14．1．3　边框阴影box-shadow262
14．2　背景． 264
14．2．1　背景图片尺寸background-size．264
14．2．2　背景图片定位区域backgroundorigin
0．264
14．2．3　背景绘制区域background-clip266
14．3　文本． 268
14．3．1　文本阴影text-shadow268
14．3．2　强制换行word-wrap．268
14．3．3　文本溢出text-overflow．269
14．3．4　文字描边text-stroke270
14．3．5　文本填充颜色text-fill-color． 271
14．4　多列 272
14．4．1　创建多列column-count272
14．4．2　列的宽度column-width273
14．4．3　列的间隔column-gap．274
14．4．4　列的规则column-rule．275
14．5　转换 276
14．5．1　移动translate()．276
14．5．2　旋转rotate()．277
14．5．3　缩放scale()278
14．5．4　扭曲skew()279
14．5．5　矩阵matrix()280
14．6　过渡． 280
14．7　动画． 282
14．7．1　@keyframes规则声明动画282
14．7．2　animation使用动画．283
14．8　用户界面 285
14．8．1　Box Sizing．285
14．8．2　resize．286
14．8．3　Outline Offset．287
14．9　实例应用． 288
14．9．1　鼠标放上去显示全部内容288
14．9．2　美观的图片排列．289
14．10　练习题． 290
第15章　JavaScript脚本基础
15．1　JavaScript简介． 293
15．2　JavaScript基本语法． 294
15．2．1　常量和变量．294
15．2．2　表达式和运算符．295
15．2．3　基本语句296
15．2．4　函数．299
15．3　JavaScript的事件 299
15．3．1　onClick事件．299
15．3．2　onchange事件．300
15．3．3　onSelect事件． 301
15．3．4　onFocus事件．303
15．3．5　onLoad事件．304
15．3．6　onUnload事件．304
15．3．7　onBlur事件305
15．3．8　onMouseOver事件306
15．3．9　onMouseOut事件307
15．3．10　onDblClick事件308
15．3．11　其他常用事件． 310
15．4　浏览器的内部对象． 311
15．4．1　navigator对象 312
15．4．2　document对象． 312
15．4．3　windows对象． 314
15．4．4　location对象 315
15．4．5　history对象 316
15．5　练习题 316
第16章　利用JavaScript制作网页特效
16．1　时间特效 319
16．1．1　显示当前时间． 319
16．1．2　显示当前日期320
16．1．3　显示网页停留时间 321
16．1．4　制作倒计时特效．322
16．2　图像特效． 323
16．2．1　当鼠标指针经过图像时图像震动效果．323
16．2．2　图片闪烁效果324
16．2．3　自动切换图像325
16．3　窗口特效． 326
16．3．1　全屏显示窗口326
16．3．2　定时关闭窗口327
16．4　鼠标特效． 328
16．4．1　禁止鼠标右击328
16．4．2　跟随鼠标指针移动的图像328
16．4．3　跟随鼠标指针的滚动字幕330
16．5　其他特效． 332
16．5．1　设置为首页和加入收藏夹332
16．5．2　浏览器状态栏显示信息．333
16．5．3　进入网站的口令设置333
16．6　练习题 334
第17章　在Dreamweaver中编辑HTML
网页
17．1　Dreamweaver的基本操作界面 337
17．2　在网页中使用文本 337
17．2．1　插入文本．337
17．2．2　设置文本属性33817．2．3　插入特殊字符340
17．2．4　插入水平线． 341
17．3　插入图像． 342
17．3．1　在网页中插入图像343
17．3．2　设置图像属性343
17．3．3　使用图像编辑器．345
17．3．4　插入鼠标经过图像．347
17．4　插入多媒体． 349
17．4．1　插入Flash349
17．4．2　打开浏览器窗口． 351
17．4．3　插入Java Applet352
17．5　设置链接． 354
17．5．1　创建文字链接354
17．5．2　创建图像链接355
17．5．3　创建锚点链接356
17．6　布局网页． 359
17．6．1　使用表格．359
17．6．2　使用DIV．362
17．7　使用表单． 363
17．7．1　插入表单．364
17．7．2　插入文本域．365
17．7．3　插入单选按钮和复选框．367
17．7．4　插入菜单和列表370
17．7．5　插入跳转菜单 371
17．7．6　插入按钮372
17．8　使用CSS样式表 374
17．8．1　CSS的基本概念374
17．8．2　建立标签样式374
17．8．3　建立类样式．375
17．8．4　建立复合内容样式．375
17．8．5　应用CSS固定字体大小376
17．9　使用行为． 377
17．9．1　行为的基本知识．377
17．9．2　使用行为制作特效．379
17．10　在网页中添加脚本． 380
17．11　练习题． 382
第18章　个人博客网站布局
18．1　博客网站概述 384
18．2　博客网站主页布局设计 384
18．3　博客网站主页具体制作过程． 385
18．3．1　导入外部CSS．385
18．3．2　制作网页头部分．386
18．3．3　制作页面内容部分．389
18．3．4　制作页面页脚部分．398
18．4　练习题 399
第19章　公司宣传网站的布局
19．1　企业网站设计分析 401
19．1．1　企业网站内容设计 401
19．1．2　排版构架． 401
19．2　各部分设计． 402
19．2．1　Logo与顶部导航．402
19．2．2　左侧导航404
19．2．3　主体内容406
19．2．4　制作搜索部分408
19．2．5　制作公司新闻409
19．2．6　制作联系我们409
19．2．7　底部版权信息409
19．3　练习题 410
附录A　HTML网页制作技巧精讲
技巧1　制作带背景音乐的网页 412
技巧2　设置每隔一定的时间自动刷新网页． 412
技巧3　提高站点在搜索引擎中被搜索到的机会 412
技巧4　让站点自动跳转到另一页 412
技巧5　避免自己的图片被其他站点利用 412
技巧6　不用表格而准确地分隔图片和文字． 412
技巧7　跳到页面的顶部 412
技巧8　在一个站点的不同页面播放同一个声音文件 412
技巧9　清除页面中的框架结构． 412
技巧10　防止站点页面被任意链接． 412
技巧11　为文字链接加上提示． 413
技巧12　删除图片链接的蓝色边框． 413
技巧13　让浏览器正确显示word格式文件． 413
技巧14　利用水平线制作垂直线 413
技巧15　正确选择JPG和GIF图片格式． 413
技巧16　正确使用分隔线 413
技巧17　去除页面四周的空白． 413
技巧18　去除浏览器的滚动条． 413
附录B　CSS常用技巧精讲
技巧1　去掉网页超链接的下画线． 415
技巧2　设置浮动背景． 415
技巧3　正确对齐文本． 415
技巧4　超链接访问过后防止hover样式出现问题 415
技巧5　解决list-style-image无法准确定位的问题 415
技巧6　让文本垂直居中 416
技巧7　使一个层垂直居中于浏览器 416
技巧8　给部分内容加上边框 416
技巧9　利用CSS去掉下画线． 416
技巧10　让div横向排列． 417
技巧11　巧妙设置滚动条颜色． 417
附录C　JavaScript特效制作精讲
技巧1　添加链接提示． 419
技巧2　在网页中加入最后修改日期 419
技巧3　实现图片循环隐现的效果 419
技巧4　给图像添加探照灯效果． 419
技巧5　打开一个新的浏览器窗口并设置窗口的属性 420
技巧6　利用单击来关闭浏览器窗口 421
技巧7　禁止保存网页． 421
技巧8　制作网页中雪花飘飘效果 421
技巧9　在状态栏中显示跑马灯效果 423
技巧10　制作烟花效果． 423
技巧11　制作状态栏数字时钟． 425
技巧12　制作围绕鼠标指针旋转的文本． 426
技巧13　制作跟随鼠标指针飘动的双层时钟 427
技巧14　实现每天不同时间显示不同信息 430
技巧16　实现鼠标指针移上时图片加亮的效果． 431
技巧15　禁止鼠标右键和左键对页面的操作 431
技巧16　实现鼠标指针移上的图片加亮的效果 431
技巧17　让网页中跳出一个会说话的老人 431
技巧18　让浏览者知道自己访问网页的次数 433
技巧19　禁止页面最小化 434
技巧20　设置网页由中间向外扩大变化． 434
附录D　Dreamweaver常用技巧精讲
技巧1　在Dreamweaver中插入空格． 436
技巧2　在Dreamweaver中设置Flash动画的背景透明 436
技巧3　在Dreamweaver中准确定位层 436
技巧4　把别人网页上的背景音乐保存下来． 436
技巧5　使网页在不同分辨率下都全屏铺开． 436
技巧6　在Dreamweaver中给水平线加颜色． 436
技巧7　在网页中实现Flash的全屏播放 436
技巧8　怎么样让在800×600分辨率下生成的网页在1024×768分辨率下居中显示． 436
技巧9　清除网页中不必要的HTML代码． 436
技巧10　在网页中添加E-mail链接并显示预定的主题 436
技巧11　在网页中添加电子邮件表单提交． 437
技巧12　防止别人把自己的网页放在框架里 437
技巧13　巧妙实现两个表格的并排． 437

前言/序言

点亮数字世界：掌握现代网页设计与开发的精髓 在当今信息爆炸的时代，互联网已成为我们生活、工作和娱乐不可或缺的平台。而构建这一切的基石，正是那些精心编织的网页。从最初的静态文本展示，到如今高度互动、视觉效果丰富的动态应用，网页技术的发展一日千里。本书旨在带领读者，无论你是零基础的初学者，还是希望巩固和拓展技能的开发者，都能系统性地掌握构建现代网页所需的关键技术——HTML、CSS 和 JavaScript。我们将从最基础的理念出发，逐步深入到复杂的技巧和最佳实践，让你不仅能理解“如何做”，更能领悟“为何如此”。 第一部分：HTML – 网页结构的灵魂 HTML（HyperText Markup Language），超文本标记语言，是网页的骨架。它负责定义网页内容的结构和语义，告诉浏览器每个元素是什么——是标题、段落、图片、链接，还是列表？本书将带你深入理解HTML的强大之处，从最基本的文档结构 ``、``、`` 和 `` 开始，为你构建坚实的基础。 我们将详细讲解各种常用HTML标签的用法和属性： 文本内容： `

` 到 `

` 的标题层级，`

` 段落，`` 和 `` 的强调，`` 的高亮，`

` 的引用，`` 的短引用，`

---

` 的水平线，`
` 的换行。你将学会如何清晰地组织文本信息，使其易于阅读和理解。 链接与导航： `` 标签是实现网页间跳转的关键。我们将深入探讨 `href` 属性的各种用法，包括内部链接、外部链接、锚点链接，以及 `target` 属性如何控制链接的打开方式。你还将学习如何构建有效的导航菜单，帮助用户在网站中顺畅浏览。 媒体元素： 图像 (``) 是网页视觉吸引力的重要组成部分。我们将详细介绍 `src`、`alt`、`width`、`height` 等属性，并讨论响应式图像的最佳实践。音频 (`