第1章 网页和网站制作流程 1
1.1认识网页 2
1.1.1网页和网站 2
1.1.2网页基本构成元素 2
1.2网页设计 3
1.2.1网页设计概述 4
1.2.2网页设计特点 4
1.2.3网页设计相关术语 6
1.3如何设计网页 7
1.3.1网页设计基本原则 7
1.3.2网页设计成功要素 8
1.3.3网页设计风格及色彩搭配 9
1.4网页设计师应具备的素质 10
1.4.1艺术素质 10
1.4.2技能素质 10
1.4.3综合素质 10
1.5网站制作流程 11
1.5.1前期策划 11
1.5.2页面细化及实施 11
1.5.3后期维护 11
1.6专家解惑 12
第2章 网页实现技术—HTML5 13
2.1 HTML5基本概念 14
2.1.1 HTML5简介 14
2.1.2 HTML5文件基本结构 15
2.1.3认识HTML5标记 16
2.2 HTML5基本元素 16
2.2.1 HTML5基本标记 17
2.2.2 HTML5实例:自我介绍 21
2.3 HTML5设置段落和图片 23
2.3.1 HTML5常用段落和图片标记 23
2.3.2 HTML5实例:文字和图片排版 24
2.4 HTML5设置表单 25
2.4.1 HTML5常用表单标记 25
2.4.2 HTML5新增表单元素和属性 29
2.4.3 HTML5实例:用户注册 32
2.5 HTML5设置表格 34
2.5.1 HTML5表格标记 34
2.5.2 HTML5实例:实现季度报表 35
2.6 HTML5文件编写方法 37
2.6.1使用记事本手工编写HTML5 37
2.6.2使用Dreamweaver CS5编写HTML文件 38
2.7 HTML5和浏览器 40
2.7.1各大浏览器与HTML5兼容 40
2.7.2新增HTML画布canvas 40
2.7.3新增HTML5音频audio 42
2.7.4新增HTML5视频video 43
2.8综合实例——网站首页 43
2.9专家解惑 46
第3章CSS3概述 47
3.1 CSS3介绍 48
3.1.1 CSS3功能 48
3.1.2 CSS3发展历史 48
3.1.3浏览器与CSS3 49
3.2编辑和浏览CSS 49
3.2.1 CSS基本语法 49
3.2.2手工编写CSS 50
3.2.3 Dreamweaver编写CSS 51
3.3在HTML5中使用CSS3的方法 52
3.3.1行内样式 53
3.3.2内嵌样式 53
3.3.3链接样式 55
3.3.4导入样式 56
3.3.5优先级问题 57
3.4综合实例——制作五彩标题 59
3.5专家解惑 62
第4章CSS3基础语法 63
4.1 CSS3选择器 64
4.1.1标签选择器 64
4.1.2类选择器 65
4.1.3 ID选择器 66
4.1.4全局选择器 68
4.1.5组合选择器 69
4.1.6继承选择器 70
4.1.7伪类 71
4.1.8属性选择器 72
4.1.9结构伪类选择器 74
4.1.10 UI元素状态伪类选择器 75
4.2选择器声明 76
4.2.1集体声明 76
4.2.2多重嵌套声明 77
4.3 CSS3常用单位 78
4.3.1颜色单位 78
4.3.2长度单位 81
4.4 CSS3继承 83
4.5综合实例——制作新闻菜单 84
4.6专家解惑 86
第5章CSS3字体与段落属性 88
5.1字体属性 89
5.1.1字体font-family 89
5.1.2字号font-size 90
5.1.3字体风格font-style 91
5.1.4加粗字体font-weight 92
5.1.5小写字母转为大写字母font-variant 93
5.1.6字体复合属性font 94
5.1.7字体颜色color 95
5.2文本高级样式 96
5.2.1阴影文本text-shadow 96
5.2.2溢出文本text-overflow 98
5.2.3控制换行word-wrap 99
5.2.4保持字体尺寸不变font-size-adjust 100
5.3段落属性 101
5.3.1单词间隔word-spacing 101
5.3.2字符间隔letter-spacing 102
5.3.3文字修饰text-decoration 103
5.3.4垂直对齐方式vertial-align 104
5.3.5文本转换text-transform 106
5.3.6水平对齐方式text-align 107
5.3.7文本缩进text-indent 108
5.3.8文本行高line-height 109
5.3.9处理空白white-space 110
5.3.10文本反排unicode-bidi和direction 111
5.4综合实例1——设置网页标题 113
5.5综合实例2——网页简单图文混排 114
5.6专家解惑 116
第6章CSS美化图片 117
6.1图片边框样式 118
6.1.1图片边框 118
6.1.2图片缩放 119
6.2对齐图片 121
6.2.1横向对齐方式 121
6.2.2纵向对齐方式 122
6.3图文混排 124
6.3.1文字环绕 124
6.3.2设置图片与文字间距 125
6.4综合实例1——一句话新闻 127
6.5综合实例2——学校宣传单 130
6.6专家解惑 132
第7章 背景与边框 134
7.1背景相关属性 135
7.1.1背景颜色 135
7.1.2背景图片 136
7.1.3背景图片重复 137
7.1.4背景图片显示 139
7.1.5背景图片位置 140
7.1.6背景图片大小 142
7.1.7背景显示区域 143
7.1.8背景图像裁剪区域 145
7.1.9背景复合属性 146
7.2边框 147
7.2.1边框样式 147
7.2.2边框颜色 149
7.2.3边框线宽 150
7.2.4边框复合属性 152
7.3圆角边框 152
7.3.1圆角边框属性 152
7.3.2指定两个圆角半径 153
7.3.3绘制4个不同圆角边框 154
7.3.4绘制边框种类 157
7.4图像边框 158
7.4.1图像边框属性 158
7.4.2设置图像边框显示方式 160
7.4.3图像边框重复性解析 162
7.5综合实例——简单的公司主页 163
7.6专家解惑 166
第8章CSS3美化超级链接和鼠标 168
8.1超级链接基本样式 169
8.1.1改变超级链接基本样式 169
8.1.2超级链接背景图设置 171
8.1.3超级链接按钮效果 172
8.2鼠标特效 173
8.2.1 CSS3控制鼠标箭头 174
8.2.2鼠标变幻超级链接 175
8.2.3页面滚动条 176
8.3综合实例1——图片超级链接 178
8.4综合实例2——制作实用工具栏 180
8.5综合实例3——鼠标特效 181
8.6专家解惑 184
第9章CSS3美化表格和表单样式 185
9.1表格基本样式 186
9.1.1表格边框样式 186
9.1.2表格边框宽度 188
9.1.3表格边框颜色 189
9.2 CSS3与表单 191
9.2.1美化表单中元素 191
9.2.2美化提交按钮 193
9.2.3美化下拉菜单 194
9.3综合实例I——隔行变色 196
9.4综合实例2——表格图文网页布局 198
9.5综合实例3——变色表格 200
9.6综合实例4——登录表单 204
9.7综合实例5——注册表单 206
9.8专家解惑 208
第10章CSS3制作实用菜单 209
10.1项目列表 210
10.1.1美化无序列表 210
10.1.2美化有序列表 212
10.1.3美化自定义列表 213
10.1.4图片列表 214
10.1.5列表缩进 216
10.1.6列表复合属性 217
10.2无序表格的菜单 218
10.3菜单的横竖转换 221
10.4综合实例1——段落模拟列表效果 223
10.5综合实例2——模拟soso导航栏 225
10.6专家解惑 228
第11章 应用CSS3滤镜 229
11.1滤镜概述 230
11.2 Alpha滤镜 231
11.3 BlendTrans滤镜 233
11.4 Blur滤镜 235
11.5 Chroma滤镜 236
11.6 DropShadow滤镜 237
11.7 FlipH滤镜 239
11.8 Glow滤镜 240
11.9 Gray滤镜 241
11.10 Invert滤镜 242
11.11 FlipV滤镜 242
11.12 Light滤镜 243
11.13 Mask滤镜 245
11.14 RevealTrans滤镜 246
11.15 Shadow滤镜 248
11.16 Wave滤镜 249
11.17 X-ray滤镜 250
11.18专家解惑 251
第12章 定位与布局 252
12.1定位方式 253
12.1.1定位属性 253
12.1.2 position定位 253
12.1.3层叠顺序z-index 257
12.1.4边偏移属性 259
12.2 float浮动定位 260
12.3 overflow溢出定位 262
12.4 visibility隐藏定位 264
12.5块和行内元素display 266
12.5.1块元素 266
12.5.2行内元素 268
12.6综合实例——定位布局新闻 269
12.7专家解惑 272
第13章CSS3盒子和DIV布局 273
13.1认识div层 274
13.1.1层在HTML布局应用 274
13.1.2 div和span区别 275
13.2盒子模型 276
13.2.1什么是盒子模型 276
13.2.2 border边框 277
13.2.3 padding内边距 278
13.2.4 margin外边距 280
13.3 CSS3新增弹性盒子模型 283
13.3.1盒子布局取向box-orient 284
13.3.2盒子布局顺序box-direction 285
13.3.3盒子布局位置box-ordinal-group 286
13.3.4盒子弹性空间box-flex 288
13.3.5管理盒子空间box-pack和box-align 290
13.3.6空间溢出管理box-lines 291
13.4综合实例1——图文排版效果 293
13.5综合实例2——淘宝导购菜单 295
13.6专家解惑 298
第14章DIV+CSS3页面基本排版 299
14.1 CSS3排版观念 300
14.1.1将页面用DIV分块 300
14.1.2设置各块位置 300
14.1.3用CSS定位 301
14.2固定宽度布局 304
14.2.1上中下版式 304
14.2.2左右版式 307
14.3自适应宽度布局 311
14.4其他页面排版 314
14.4.1浮动布局 314
14.4.2隐藏布局 317
14.5新增CSS3多列布局 319
14.5.1列宽度column-width 319
14.5.2列数column-count 321
14.5.3 列间距column-gap 322
14.5.4列边框样式column-rule 324
14.6综合实例1——模拟起点中文网布局 326
14.7综合实例2——电子企业首页 330
14.8综合实例3——汽车网站首页 334
14.9专家解惑 338
第15章DIV+CSS3布局实战 339
15.1 DIV布局优势 340
15.2综合实例1——家庭相册 340
15.3综合实例2——个人网站首页 344
15.4综合实例3——旅游网站首页 352
15.5专家解惑 357
第16章CSS3与JavaScript的搭配应用 358
16.1 JavaScript概述 359
16.1.1 JavaScript概念 359
16.1.2 JavaScript引用 359
16.1.3 JavaScript与CSS 360
16.2 JavaScript语法基础 361
16.2.1数据类型 361
16.2.2变量 362
16.2.3运算符 363
16.2.4流程控制语句 365
16.2.5函数 368
16.3综合实例1——打字效果的文字 371
16.4综合实例2——文字升降特效 373
16.5综合实例3——跑马灯效果 375
16.6综合实例4——闪烁图片 377
16.7综合实例5——左右移动的图片 378
16.8综合实例6——向上滚动的菜单 381
16.9综合实例7——跟随鼠标移动的图片 382
16.10综合实例8——树形菜单 384
16.11综合实例9——时钟特效 388
16.12综合实例10——颜色选择器 391
16.13专家解惑 393
第17章CSS3与XML的综合运用 394
17.1 XML语法基础 395
17.1.1 XML概念 395
17.1.2 XML文档组成和声明 396
17.1.3 XML元素介绍 398
17.2 CSS修饰XML文件 400
17.2.1 XML使用CSS 400
17.2.2设置字体属性 401
17.2.3设置色彩属性 402
17.2.4设置边框属性 403
17.2.5设置文本属性 404
17.3实例1:招聘广告 406
17.4实例2:书目清单 408
17.5实例3:图文混排页面 411
17.6实例4:古诗欣赏 413
17.7专家解惑 416
第18章 心灵深处的旋律——音乐网站 417
18.1构思布局 418
18.1.1设计分析 418
18.1.2排版架构 419
18.2模块分割 421
18.2.1页头部分 421
18.2.2左侧内容列表 423
18.2.3中间内容列表 425
18.2.4右侧内容列表 427
18.2.5页脚部分 428
18.3整体调整 429
18.3.1页面内容主体调整 429
18.3.2页面整体调整 430
18.4专家解惑 431
第19章 企业的门面——小型企业网站开发 432
19.1构思布局 433
19.1.1设计分析 433
19.1.2排版架构 433
19.2模块分割 435
19.2.1 Logo与导航菜单 435
19.2.2左侧文本介绍 437
19.2.3右侧导航链接 438
19.2.4版权信息 440
19.3整体调整 441
19.4专家解惑 442
第20章 似水年华——女性个人网站 443
20.1构思布局 444
20.1.1设计分析 444
20.1.2排版架构 444
20.2模块分割 446
20.2.1网站名称 446
20.2.2日志文章 447
20.2.3页面导航 448
20.2.4作者信息 450
20.3整体调整 451
20.4专家解惑 452
第21章 公司宣传有秘籍——时尚内衣网站 453
21.1构思布局 454
21.1.1设计分析 454
21.1.2排版架构 454
21.2模块分割 456
21.2.1页面导航和Logo图片 456
21.2.2新产品展示 458
21.2.3品牌形象和产品展示栏目 459
21.2.4内衣欣赏 461
21.2.5公司信息 462
21.3整体调整 463
21.4专家解惑 464
第22章 传承文化——文化宣传类网站 465
22.1构思布局 466
22.1.1设计分析 466
22.1.2排版架构 466
22.2模块分割 468
22.2.1页头部分 468
22.2.2左侧部分 469
22.2.3右侧部分 470
22.2.4中间部分 471
22.2.5页脚部分 473
22.3整体调整 474
22.4专家解惑 475