第1章 社区交友网站 1
1.1网站页面效果分析 1
1.1.1首页效果分析 1
1.1.2博客页面的效果分析 2
1.1.3网站文件综述 3
1.2规划首页的布局 4
1.2.1搭建首页页头的DIV 4
1.2.2搭建导航菜单部分的DIV 5
1.2.3搭建首页主体部分最左列的DIV 6
1.2.4搭建“你的圈子”部分的DIV 7
1.2.5搭建“最近博客文章”部分的DIV 8
1.2.6搭建页脚部分的DIV 9
1.2.7首页CSS效果分析 9
1.3电子贺卡页面 10
1.3.1导航列表部分的DIV 10
1.3.2贺卡目录部分的DIV 11
第2章 众星璀璨的影视网站 13
2.1网站页面效果分析 13
2.1.1首页效果分析 13
2.1.2电影分类页面的效果分析 15
2.1.3网站文件综述 16
2.2规划首页的布局 16
2.2.1搭建首页页头的DIV 16
2.2.2搭建“最新电影”部分的DIV 17
2.2.3搭建“最新电影新闻”部分的DIV 18
2.2.4搭建“搜索”部分的DIV 20
2.2.5搭建页脚部分的DIV 21
2.2.6首页CSS效果分析 22
2.3分类页面 23
2.3.1分类页面左边部分的DIV 23
2.3.2分类页面中间部分的DIV 24
第3章 美食资讯网站 27
3.1网站页面效果分析 27
3.1.1首页效果分析 27
3.1.2美食店铺页面的效果分析 29
3.1.3网站文件综述 30
3.2规划首页的布局 30
3.2.1搭建首页页头的DIV 30
3.2.2搭建“高级搜索”部分的DIV 31
3.2.3搭建“免费试吃餐厅”部分的DIV 32
3.2.4搭建“飙升排行榜”部分的DIV 33
3.2.5搭建页脚部分的DIV 34
3.2.6首页CSS效果分析 35
3.3在首页中实现动态效果 35
3.4店铺介绍页面 37
3.4.1店铺介绍页面菜单标签的DIV 37
3.4.2店铺介绍页面右边相关介绍的DIV 38
第4章 宠物题材的主题网站 40
4.1网站页面效果分析 40
4.1.1首页效果分析 40
4.1.2宠物社区页面的效果分析 41
4.1.3网站文件综述 42
4.2规划首页的布局 43
4.2.1搭建首页页头的DIV 43
4.2.2搭建“宠物新闻”部分的DIV 44
4.2.3搭建“分类导航”部分的DIV 44
4.2.4搭建“图片欣赏”部分的DIV 45
4.2.5搭建“联系方式”部分的DIV 46
4.2.6搭建“宠物故事”部分的DIV 47
4.2.7搭建“宠物信息”部分的DIV 47
4.2.8搭建页脚部分的DIV 47
4.2.9首页CSS效果分析 48
4.3首页特色 48
4.4宠物社区页面 50
第5章 温馨怡人的电影网站 51
5.1网站页面效果分析 51
5.1.1首页效果分析 51
5.1.2新片介绍页面的效果分析 52
5.1.3网站文件综述 53
5.2规划首页的布局 54
5.2.1搭建首页页头的DIV 54
5.2.2搭建首页主体部分的DIV 54
5.2.3搭建页脚部分的DIV 57
5.2.4首页CSS效果分析 58
5.3在首页中实现动态效果 59
5.3.1变换Logo颜色的方法 60
5.3.2实现导航凸出的效果 60
5.4新片介绍页面 61
5.4.1电影列表的DIV 61
5.4.2最新影评的DIV 62
5.4.3电影导航的DIV 63
第6章 导游推广为一体的海洋公园网站 65
6.1网站页面效果分析 65
6.1.1首页效果分析 65
6.1.2导游页面的效果分析 66
6.1.3网站文件综述 67
6.2规划首页的布局 68
6.2.1搭建首页页头的DIV 68
6.2.2搭建“标题图片”部分的DIV 69
6.2.3搭建“最新特别公告”部分的DIV 70
6.2.4搭建“海洋公园欢迎您”部分的DIV 71
6.2.5搭建页脚部分的DIV 72
6.2.6首页CSS效果分析 73
6.3导游页面 74
6.3.1导游页面右边部分的DIV 74
6.3.2导游页面娱乐项部分的DIV 75
第7章 主题明显的环保网站 77
7.1网站页面效果分析 77
7.1.1首页效果分析 77
7.1.2环保图片展示页面的效果分析 78
7.1.3网站文件综述 79
7.2规划首页的布局 79
7.2.1搭建首页页头的DIV 79
7.2.2搭建导航和快速链接部分的DIV 80
7.2.3搭建“图片新闻”部分的DIV 81
7.2.4搭建“图片见证”部分的DIV 82
7.2.5搭建页脚部分的DIV 83
7.2.6首页CSS效果分析 83
7.3在首页中实现动态效果 84
7.4环保图片页面 85
7.4.1环保导航部分的DIV 85
7.4.2导航菜单部分的DIV 86
7.4.3图片部分的DIV 87
第8章 寓教于乐的博物馆网站 89
8.1网站页面效果分析 89
8.1.1首页效果分析 89
8.1.2最近活动页面的效果分析 91
8.1.3网站文件综述 91
8.2规划首页的布局 92
8.2.1搭建首页页头的DIV 92
8.2.2搭建“导航菜单”部分的DIV 93
8.2.3搭建“馆内资讯”等四部分的DIV 94
8.2.4搭建“馆内要闻和科教动态”部分的DIV 95
8.2.5搭建页脚部分的DIV 95
8.2.6首页CSS效果分析 97
8.3在首页中实现动态效果 97
8.4最近活动页面 98
8.4.1“最近活动信息”部分的DIV 98
8.4.2右边部分导航菜单的DIV 99
第9章 体现个性的个人网站 101
9.1网站页面效果分析 101
9.1.1首页效果分析 101
9.1.2作品导航页的效果分析 102
9.1.3网站文件综述 104
9.2规划首页的布局 104
9.2.1搭建首页页头的DIV 104
9.2.2搭建“搜索”部分的DIV 105
9.2.3搭建“作品展示”部分的DIV 106
9.2.4搭建页脚部分的DIV 108
9.2.5首页CSS效果分析 109
9.3作品导航页面 110
9.3.1左边导航部分的DIV 110
9.3.2作品部分的DIV 111
第10章 内容丰富的交友网站 113
10.1网站页面效果分析 113
10.1.1首页效果分析 113
10.1.2活动页面的效果分析 14
10.1.3网站文件综述 115
10.2规划首页的布局 116
10.2.1搭建首页页头的DIV 116
10.2.2搭建首页主体部分的DIV 117
10.2.3搭建页脚部分的DIV 119
10.2.4首页CSS效果分析 120
10.3在首页中实现动态效果 122
10.3.1更改字体的实现方式 122
10.3.2实现更换会员信息的效果 123
10.4活动页面 124
10.4.1活动页面左边部分的DIV 124
10.4.2活动页面右边部分的DIV 125
第11章 酒店介绍网站 127
11.1网站页面效果分析 127
11.1.1首页效果分析 127
11.1.2酒店搜索页面的效果分析 128
11.1.3网站文件综述 129
11.2规划首页的布局 130
11.2.1搭建首页页头的DIV 130
11.2.2搭建“酒店广告”部分的DIV 131
11.2.3搭建“酒店推广”部分的DIV 132
11.2.4搭建“酒店新闻”部分的DIV 132
11.2.5搭建“视频新闻”部分的DIV 133
11.2.6搭建“友情链接”部分的DIV 134
11.2.7搭建页脚部分的DIV 135
11.2.8首页CSS效果分析 135
11.3在首页中实现动态效果 136
11.4酒店搜索页面 137
11.4.1酒店搜索页面左边部分的DIV 138
11.4.2酒店搜索页面右边部分的DIV 138
第12章 教育网站 141
12.1网站页面效果分析 141
12.1.1首页效果分析 141
12.1.2教育中心页面的效果分析 142
12.1.3网站文件综述 143
12.2规划首页的布局 144
12.2.1搭建首页页头的DIV 144
12.2.2搭建“行业前景”部分的DIV 145
12.2.3搭建“重要新闻”部分的DIV 146
12.2.4搭建“订购电子新闻”等部分的DIV 146
12.2.5搭建页脚部分的DIV 147
12.2.6首页CSS效果分析 147
12.3教育中心页面 148
12.3.1“教学一览”部分的DIV 148
12.3.2“教学管理”部分的DIV 149
12.3.3“课程安排”等部分的DIV 150
第13章 简单实用的旅行社门户网站 151
13.1网站页面效果分析 151
13.1.1首页效果分析 151
13.1.2自驾游页面的效果分析 153
13.1.3网站文件综述 153
13.2规划首页的布局 154
13.2.1搭建首页页头的DIV 154
13.2.2搭建“航班查询”部分的DIV 155
13.2.3搭建“热门旅游线路”部分的DIV 156
13.2.4搭建“特色项目”部分的DIV 157
13.2.5搭建“推荐游玩地”部分的DIV 157
13.2.6搭建“特别推荐”部分的DIV 158
13.2.7搭建页脚部分的DIV 159
13.2.8首页CSS效果分析 159
13.3自驾游页面 160
13.3.1自驾游页面左边部分的DIV 160
13.3.2自驾游页面右边部分的D 161
第14章 电脑商城网站 163
14.1网站页面效果分析 163
14.1.1首页效果分析 163
14.1.2台式机页面的效果分析 165
14.1.3网站文件综述 166
14.2规划首页的布局 167
14.2.1搭建首页页头的DIV 167
14.2.2搭建首页主体部分的DIV 167
14.2.3搭建页脚部分的DIV 170
14.2.4 首页CSS效果分析 171
14.3在首页中实现动态效果 172
14.3.1图片展开的实现方式 173
14.3.2导航小模块出现背景色 174
14.4台式机页面 175
14.4.1台式机页面左边部分的DIV 175
14.4.2台式机页面右边部分的DIV 176
第15章 汽车网站 178
15.1网站页面效果分析 178
15.1.1首页效果分析 178
15.1.2新车介绍页面的效果分析 179
15.1.3网站文件综述 180
15.2规划首页的布局 180
15.2.1搭建首页页头的DIV 180
15.2.2搭建“广告”部分的DIV 182
15.2.3搭建“最新新闻”部分的DIV 182
15.2.4搭建“新车上市”部分的DIV 183
15.2.5搭建“最新动态”部分的DIV 184
15.2.6搭建页脚部分的DIV 185
15.2.7首页CSS效果分析 186
15.3在首页中实现菜单的动态效果 187
15.4新车介绍页面 188
15.4.1新车介绍页面左边列表的DIV 188
15.4.2新车介绍页面右边部分的DIV 190
第16章 美观的巧克力网站设计 193
16.1网站页面效果分析 193
16.1.1首页效果分析 193
16.1.2巧克力产品列表页面的效果分析 194
16.1.3巧克力网站的文件综述 195
16.2规划首页的布局 195
16.2.1首页切图 195
16.2.2搭建首页网站导航部分的DIV 196
16.2.3搭建首页Logo部分的DIV 196
16.2.4搭建“巧克力文化”和“巧克力产品”部分的DIV 197
16.2.5搭建页脚部分的DIV 199
16.2.6首页CSS效果分析 200
16.3利用CSS样式完善首页效果 201
16.3.1首页页头的CSS效果 201
16.3.2定义首页页脚的CSS效果 202
16.4产品列表页面 202
16.4.1产品列表页面分类部分的DIV 203
16.4.2产品列表页面产品部分的DIV 203
16.5产品详细页面 204
第17章 火爆的三国杀桌面游戏网站 206
17.1网站页面效果分析 206
17.1.1首页效果分析 206
17.1.2三国杀卡牌介绍页面的效果分析 208
17.1.3网站文件综述 208
17.2规划首页的布局 209
17.2.1搭建首页页头的DIV 209
17.2.2搭建标题性图片区域部分的DIV 210
17.2.3搭建“玩家视频”部分的DIV 210
17.2.4搭建“游戏攻略”部分的DIV 211
17.2.5搭建“玩家讨论区”部分的DIV 212
17.2.6搭建“壁纸下载”等部分的DIV 214
17.2.7搭建页脚部分的DIV 215
17.2.8首页CSS效果分析 215
17.3首页讨论区部分的链接效果 217
17.4卡牌介绍页面 218
17.4.1卡牌介绍页面标签卡部分的DIV 218
17.4.2卡牌介绍页面左边部分的DIV 219
17.4.3卡牌介绍页面右边部分的DIV 219
第18章 布局经典的设计公司网站 220
18.1网站页面效果分析 220
18.1.1首页效果分析 220
18.1.2设计理念页面的效果分析 222
18.1.3网站文件综述 222
18.2规划首页的布局 223
18.2.1搭建首页页头的DIV 223
18.2.2搭建“企业简介”部分的DIV 224
18.2.3搭建“优秀网站案例”部分的DIV 225
18.2.4搭建“我们的观点”部分的DIV 226
18.2.5搭建“我们的设计理念”部分的DIV 226
18.2.6搭建页脚部分的DIV 228
18.2.7首页CSS效果分析 228
18.3设计理念页面 229
18.3.1“我们的服务”部分的DIV 229
18.3.2行业案例展示部分的DIV 231
18.3.3“标志设计”部分DIV 232
第19章 深蓝色调的社区网站 233
19.1网站页面效果分析 233
19.1.1首页效果分析 233
19.1.2博客列表页面的效果分析 234
19.1.3网站文件综述 235
19.2规划首页的布局 235
19.2.1搭建首页页头的DIV 236
19.2.2搭建“网站导航”部分的DIV 237
19.2.3搭建“分类导航”部分的DIV 238
19.2.4搭建页脚部分的DIV 240
19.2.5首页CSS效果分析 240
19.3博客列表页面 241
19.3.1博客列表页面左边导航部分的DIV 241
19.3.2博客列表页面博客显示部分的DIV 243
第20章 食品专类的购物网站 245
20.1网站页面效果分析 245
20.1.1首页效果分析 245
20.1.2食品分类介绍页面的效果分析 247
20.1.3网站文件综述 247
20.2规划首页的布局 248
20.2.1搭建首页页头的DIV 248
20.2.2搭建“功能模块”部分的DIV 249
20.2.3搭建“商品展示”部分的DIV 250
20.2.4搭建“快速导航”部分的DIV 251
20.2.5搭建页脚部分的DIV 252
20.2.6首页CSS效果分析 252
20.3首页的动态效果 253
20.4进口食品页面 253
20.4.1进口食品页面分类列表的DIV 254
20.4.2进口食品页面产品列表的DIV 255
第21章 精美绝伦的视频网站 258
21.1网站页面效果分析 258
21.1.1首页效果分析 258
21.1.2个人视频专辑页面的效果分析 260
21.1.3网站文件综述 261
21.2规划首页的布局 261
21.2.1搭建首页页头的DIV 261
21.2.2搭建视频导航菜单部分的DIV 262
21.2.3搭建“热门视频”部分的DIV 263
21.2.4搭建“焦点讨论”部分的DIV 264
21.2.5搭建“推荐视频”部分的DIV 264
21.2.6搭建“近期新视频”部分的DIV 265
21.2.7搭建页脚部分的DIV 266
21.2.8首页CSS效果分析 267
21.3在首页中实现动态效果 268
21.3.1实现父子菜单联动的效果 268
21.3.2实现图片切换的效果 269
21.4个人视频专辑页面 270
21.4.1个人视频专辑页面上边部分的DIV 270
21.4.2个人视频专辑页面下边部分的DIV 271
第22章 色彩缤纷的图片网站 273
22.1网站页面效果分析 273
22.1.1首页效果分析 273
22.1.2最新图片页面的效果分析 274
22.1.3网站文件综述 275
22.2规划首页的布局 276
22.2.1搭建首页第一行的DIV 276
22.2.2搭建页脚部分的DIV 278
22.2.3首页CSS效果分析 279
22.3首页CSS效果分析 280
22.3.1更改字体的实现方式 280
22.3.2导航栏动态效果 282
22.4最新图片页面 283
22.4.1最新图片页面左边下半部分的DIV 283
22.4.2最新图片页面右边部分的DIV 284
第23章 精美的糖果公司网站 286
23.1网站页面效果分析 286
23.1.1首页效果分析 286
23.1.2视频展示页面的效果分析 288
23.1.3网站文件综述 288
23.2规划首页的布局 289
23.2.1搭建首页页头的DIV 289
23.2.2搭建“公司介绍”部分的DIV 290
23.2.3搭建“视频展示”部分的DIV 291
23.2.4搭建推广模块的DIV 291
23.2.5搭建招商部分的DIV 291
23.2.6搭建“免费试吃”广告部分的DIV 292
23.2.7搭建页脚部分的DIV 293
23.2.8首页CSS效果分析 294
23.3视频展小页面效果分析 295
23.3.1导航部分的DIV 295
23.3.2导航部分下方广告位的DIV 296
23.3.3视频展示部分的DIV 297
第24章 休闲娱乐的小说阅读网站 298
24.1网站页面效果分析 298
24.1.1首页效果分析 298
24.1.2小说介绍页面的效果分析 300
24.1.3网站文件综述 301
24.2规划首页的布局 302
24.2.1搭建“注册和登录”导航条的DIV 302
24.2.2搭建Logo图标和广告图片部分的DIV 303
24.2.3搭建导航菜单的DIV 303
24.2.4搭建“最新推荐榜”部分的DIV 304
24.2.5搭建“本站强力推荐小说”部分的DIV 305
24.2.6搭建“小说导航”部分的DIV 306
24.2.7搭建“最新公告”部分的DIV 307
24.2.8搭建页脚部分的DIV 307
24.2.9首页CSS效果分析 308
24.3在首页中实现动态效果 309
24.4小说介绍页面 310
24.4.1作家介绍部分的DIV 310
24.4.2小说目录部分的DIV 310
24.4.3小说推荐部分的DIV 311
第25章 包罗万象的新闻门户网站 313
25.1网站页面效果分析 313
25.1.1首页效果分析 313
25.1.2新闻专题导读页面的效果分析 315
25.1.3网站文件综述 316
25.2规划首页的布局 316
25.2.1搭建首页页头的DIV 316
25.2.2搭建“新闻专栏”部分的DIV 317
25.2.3搭建“热点新闻”部分的DIV 318
25.2.4搭建“主题频道”部分的DIV 319
25.2.5搭建“社会新闻”部分的DIV 320
25.2.6搭建“关于我们”部分的DIV 322
25.2.7搭建页脚部分的DIV 322
25.2.8首页CSS效果分析 323
25.3新闻专题导读页面 324
25.3.1搜索部分的DIV 324
25.3.2新闻专题部分的DIV 324
第26章 医院网站 326
26.1网站页面效果分析 326
26.1.1首页效果分析 326
26.1.2专家介绍页面的效果分析 327
26.1.3网站文件综述 328
26.2规划首页的布局 328
26.2.1搭建首页页头部分 329
26.2.2搭建“医学导读”部分的DIV 330
26.2.3搭建“健康你我”部分的DIV 331
26.2.4搭建“最新新闻”部分的DIV 331
26.2.5搭建“便民导航”部分的DIV 332
26.2.6搭建“资讯”部分的DIV 333
26.2.7搭建页脚部分的DIV 333
26.2.8首页CSS效果分析 334
26.3专家介绍页面 335
26.3.1专家介绍页面左边科室列表的DIV 335
26.3.2专家介绍页面中间部分的DIV 336
第27章 星光灿烂的娱乐资讯网站 339
27.1网站页面效果分析 339
27.1.1首页效果分析 339
27.1.2明星介绍页面的效果分析 341
27.1.3网站文件综述 342
27.2规划首页的布局 342
27.2.1搭建首页页头的DIV 342
27.2.2搭建“网站导航菜单”部分的DIV 343
27.2.3搭建“娱乐要闻”部分的DIV 344
27.2.4搭建“更多要闻”部分的DIV 345
27.2.5搭建“更多图片新闻”部分的DIV 345
27.2.6搭建页脚部分的DIV 347
27.2.7首页CSS效果分析 348
27.3明星图片页面 348
27.3.1明星图片页面左边日历部分的DIV 348
27.3.2明星图片页面中间部分的DIV 351
第28章 杂志网站 354
28.1网站页面效果分析 354
28.1.1首页效果分析 354
28.1.2杂志介绍页面的效果分析 356
28.1.3网站文件综述 356
28.2规划首页的布局 357
28.2.1搭建首页页头的DIV 357
28.2.2搭建“杂志推荐”部分的DIV 359
28.2.3搭建“杂志列表”部分的DIV 360
28.2.4搭建“填写表单”部分的DIV 361
28.2.5搭建“快速导航”部分的DIV 362
28.2.6首页CSS效果分析 363
28.3杂志介绍页面 364
28.3.1杂志介绍页面左边导航部分的DIV 364
28.3.2杂志介绍页面博客显示部分的DIV 366
第29章 简洁的购物网站 368
29.1网站页面效果分析 368
29.1.1首页效果分析 368
29.1.2商品展示页面的效果分析 370
29.1.3购物网站文件综述 371
29.2规划首页的布局 371
29.2.1搭建首页页头的DIV 371
29.2.2搭建导航部分的DIV 372
29.2.3搭建“用户博客”部分的DIV 373
29.2.4搭建“产品展示”部分的DIV 374
29.2.5搭建页脚的DIV 375
29.2.6首页CSS效果分析 375
29.3利用CSS样式完善首页效果 377
29.3.1整体布局 377
29.3.2定义其他样式 377
29.4商品展示页面 378
29.4.1用DIV层构建分页效果 378
29.4.2用CSS构建商品图片的效果 379
29.5站点地图页面 380
第30章 个人图片博客网站 382
30.1网站页面效果分析 382
30.1.1首页效果分析 382
30.1.2图片展示页面的效果分析 383
30.1.3网站文件综述 384
30.2规划首页的布局 385
30.2.1搭建首页第一行的DIV 385
30.2.2搭建首页主体部分的DIV 386
30.2.3搭建页脚部分的DIV 388
30.2.4首页CSS效果分析 389
30.3首页CSS效果分析 390
30.3.1 DIV阴影效果的实现方式 390
30.3.2图标悬浮效果 391
30.4图片展示页面 392
30.5博客文章页面 394
30.5.1博客文章页面文章部分的DIV 394
30.5.2博客文章页面归档和分类部分的DIV 396