第1章 网页基础与网站开发流程 13
1.1本书术语讲述 14
1.2显示网页的主流浏览器 15
1.3静态网页和动态网页的区别 15
1.4网站重构 16
1.4.1什么是网站重构 16
1.4.2为什么要网站重构 16
1.5网站开发的流程 17
1.5.1需求分析 17
1.5.2平台规划 17
1.5.3项目开发 17
1.5.4 测试验收 17
1.6 Web标准 18
1.6.1结构标准语言 18
1.6.2表现标准语言 18
1.6.3行为标准 18
1.7 CSS布局与table布局的区别 18
1.8网页重构用到的技术 19
1.9网页制作核心 19
1.9.1 DIV+CSS的组成元素 19
1.9.2块级元素（Block element） 19
1.9.3内联元素（Inline element） 19
1.9.4常用块元素（Block element） 19
1.9.5常用内联元素（Inline element） 20
1.9.6 DIV+CSS的盒子模型理论 20
1.9.7外边距的叠加机理 20
1.9.8 CSS文档流 21
1.10本章总结 22
第2章 设计类企业项目解析（艾古互动网） 23
2.1案例概述 24
2.1.1项目背景分析 24
2.1.2网站布局 24
2.2项目目录安排 27
2.3主容器搭建 28
2.4头部制作 30
2.4.1网站LOGO的布局 31
2.4.2导航布局 32
2.4.3服务内容布局 33
2.5内容部分布局 34
2.5.1互动体验专家与手形布局 34
2.5.2新闻动态部分布局 36
2.5.3成功案例滚动Banner布局 37
2.5.4图标链接布局 39
2.5.5解决方案Banner布局 40
2.6 尾部布局 41
2.6.1 Site map布局 42
2.6.2网站地图部分布局 42
2.6.3版权申明部分布局 45
2.6.4友情链接部分布局 46
2.7解决方案版块布局 48
2.7.1头尾部分的延续布局 48
2.7.2头部与内容部分间小导航的布局 49
2.7.3解决方案内容的布局 50
2.7.4链接图标的布局 52
2.8网站建设版块布局 53
2.8.1头尾部分的延续布局 54
2.8.2 Banner部分布局 54
2.8.3服务流程部分布局 55
2.8.4服务套餐部分布局 56
2.9本章总结 58
第3章 摄影类项目解析（尚格视觉） 59
3.1案例概述 60
3.1.1项目背景分析 60
3.1.2网站布局 60
3.2项目目录安排 63
3.3主容器搭建 64
3.4头部制作 66
3.4.1网站LOGO的布局 67
3.4.2 QQ服务内容布局 68
3.4.3导航布局 70
3.5 Banner与音乐控件布局 73
3.5.1主Banner与音乐控件布局 74
3.5.2热点新闻部分布局 76
3.5.3横向Banner布局 79
3.6主内容部分布局 80
3.6.1服务报价部分布局 80
3.6.2小贴士部分布局 83
3.6.3友情链接部分布局 84
3.6.4 精彩客片部分布局 88
3.7页尾部分布局 90
3.7.1页脚导航部分布局 91
3.7.2热贴部分布局 92
3.7.3花絮部分布局 94
3.7.4留言部分布局 96
3.7.5联系方式部分布局 96
3.8网站留言版块布局 98
3.8.1头尾部分的延续布局 99
3.8.2搜索部分布局 99
3.8.3页面洋葱皮部分布局 101
3.8.4留言记录部分布局 102
3.8.5 页码部分布局 103
3.8.6留言列表部分布局 104
3.8.7分割线与页码部分布局 107
3.8.8留言发布布局 108
3.9本章总结 110
第4章 商品类项目解析（养乐多） 111
4.1案例概述 112
4.1.1项目背景分析 112
4.1.2网站布局 112
4.2项目目录安排 115
4.3主容器搭建 116
4.4头部制作 118
4.4.1网站LOGO的布局 118
4.4.2地区选择部分布局 119
4.4.3导航布局 120
4.5主内容部分布局 122
4.5.1调查问卷部分布局 123
4.5.2最新消息部分布局 125
4.5.3 Banner布局 127
4.6页尾部分布局 128
4.6.1版权部分布局 128
4.6.2页尾连接部分布局 129
4.7新闻活动版块部分布局 130
4.7.1头尾部分的延续布局 131
4.7.2新闻活动竖向菜单布局 132
4.7.3新闻公告部分布局 135
4.7.4来源选择部分布局 137
4.7.5新闻列表部分布局 137
4.7.6新闻列表翻页部分布局 140
4.8 本章总结 141
第5章 个人展示类项目解析（Iike-v） 142
5.1案例概述 143
5.1.1项目背景分析 143
5.1.2网站布局 143
5.2项目目录安排 147
5.3主容器搭建 148
5.4头部制作 149
5.5主内容部分布局 152
5.5.1图形设计部分布局 152
5.5.2网页设计部分布局 160
5.5.3关于我们部分布局 167
5.5.4联系我们部分布局 170
5.6页尾部分布局 174
5.6.1版权部分布局 174
5.6.2页尾连接部分布局 175
5.7播放器制作 176
5.8移动广告牌 177
5.9本章总结 178
第6章 游戏类项目解析（英雄联盟） 179
6.1案例概述 180
6.1.1项目背景分析 180
6.1.2网站布局 180
6.2项目目录安排 181
6.3首页主容器搭建 182
6.4首页头部制作 184
6.5首页主内容部分布局 190
6.5.1 Banner部分布局 190
6.5.2赛事与活动 197
6.5.4 合作媒体 211
6.6 首页页尾部分布局 212
6.7列表页主容器搭建 214
6.8列表页头部制作 215
6.9列表页主内容部分布局 221
6.9.1边栏导航 221
6.9.2列表主内容 223
6.9.3边栏Banner 228
6.10列表页页尾部分布局 228
6.11本章总结 230
第7章 项目经验总结（一） 231
7.1高级文字排版分析 232
7.1.1倒影字 232
7.1.2齐线字 233
7.1.3修饰标题字 234
7.2控制字符宽度省略号效果 239
7.3居中浏览器的半透明布局 241
7.4 div高度随窗口变化而变化 243
7.5建立交叉浮动层 244
7.6三列自适应等高且中列宽度自适应 247
7.7三级弹出CSS导航菜单 249
7.8 Web前端开发规范文档 258
7.8.1规范目的 258
7.8.2基本准则 258
7.8.3文件规范 258
7.8.4HTML书写规范 259
7.8.5 CSS书写规范 260
7.8.6 JavaScript书写规范 260
7.8.7图片规范 260
7.8.8注释规范 261
7.9本章总结 261
第8章项目经验总结（二） 262
8.1 CSS中以图片替换文字的表现方法 263
8.2纯CSS代码实现翻页 266
8.3隔行换色 268
8.4评分星级效果 270
8.5柱状图表 272
8.6 鼠标经过弹性放大DIV 274
8.7双语导航 276
8.8 Banner滚动切换 277
8.9透明Flash上方的层 281
8.10本章总结 284