标题：CSS网页布局学习笔记
图书信息
作　者： 王大平　编著     
出 版 社： 电子工业出版社
出版时间： 2008-10-1
页　数： 576页
开　本： 16开
I S B N ： 9787121070150 
分类： 图书 >> 计算机>>网页设计 
定价：￥62.00元（含光盘 1张）
内容简介
本书由浅入深地讲解了CSS开发技术，并且始终遵循 Web标准来讲解各知识点的应用，并通过具体的实例来讲解其具体使用流程。全书内容分为 3部分，共15章，其中第 1-10章为第 1部分，依次讲解了 Web开发标准与网页网站制作，Web标准布局的本质、XHTML书写规范、CSS基础与书写规范、网页头部元素的详细定义、CSS基本布局属性、CSS容器属性、CSS定义文本属性、元素的修饰和 CSS常见应用、浏览器及兼容问题、整站样式表的分析、CSS高级应用等知识；第11-13章为第 2部分，讲解了 CSS高级应用，CSS实战与技巧，CSS可视化开发技术等内容；第14章和 15章为第 3部分，分别通过个人博客网站和企业网站的实现流程，介绍 CSS布局的综合应用流程和实现技巧。
本书适合广大 Web网站设计人员、网站设计的初学者、网站管理维护人员、大中专院校的学生和社会培训学员阅读。
本书独一无二的优势

本书由具有多年开发经验的程序员执笔写作，笔者在 Web 2.0领域具有多年的开发研究经验，并且具有多年的培训讲解经验，尤其熟识Ｗeb 2.0标准理论知识体系，笔者凭着娴熟的笔法和渊博的理论知识，将CSS网页布局技术展现得淋漓尽致，使读者能够很快地进入实际开发角色。本书和市场上其他类似书籍相比，具有下面与众不同的特色。
★形象
本书对书中的源代码采取绘图的讲解方式，使抽象变形象，让高深的编程理论“赤裸裸”地展现在你的面前，使你能够轻而易举地领悟编程奥秘。这是本书最大的特色。
★趣味
本书用拉链做素材，拉开学习的帷幕，用情趣似的学习笔记形式带你走进轻松的学习课堂，并且在书中让人感觉到烦躁的地方搭配以相关的图片，让你享受到学习中的乐趣，探索中的喜悦，胜
利后的兴奋。
★实用
本书的实用性较强，以实例为导向，由浅入深地讲解了CSS网页布局中的种种问题。特别是，在讲解时非常注重实践与理论的形象结合，为了能使读者通过读懂源代码来掌握CSS技术，在实例举证时还给源代码绘了大量的流程图。本书的所有源代码都已调试通过，并且放在了本书所附带的光盘中，读者拿来即可使用。
★全面
本书内容全面，从基本的语法入手，以恰当的实例为导向，由浅入深地讲解CSS技术的基本理论知识，所讲解的内容几乎囊括了CSS技术的所有知识点，读者读完此书几乎能够掌握CSS所有的开发技术。
前言

计算机软件技术的日新月异推动了社会信息化的进程，这也使得开发人员不得不学习新的技术以适应这种局面。在Web应用领域，随着网络技术的发展，各种站点纷纷建立。并且因为网络的无限性和共享性，以及各种设计软件的推出，多样化的站点展示方式便应运而生。为保证各种用户和各类软件设计出的站点信息完整的展现在用户面前，Web标准技术便应运而生。
作为传统网页布局和修饰方式，越来越落后于时代潮流，逐渐被新兴的Web标准所代替。而作为Web标准的 CSS技术，迅速成为了当今Web发展的主要因素。随着Web标准的大力推广宣传，Web标准逐渐被网站设计者所认可，越来越多的站点改版成为了符合标准的版本。Web标准能够被广大用户所迅速认可，是因为它能够给用户带来真正的好处。它不但能更加方便地实现对页面的维护，而且还能加快页面的显示速度，提高浏览者的积极性，实现了搜索引擎的优化。
随着2005年Web 2.0的提出，给Web开发带来了巨大的革新和冲击。由于Web 2.0是建立在Web标准基础之上的，所以在很大程度上推动了Web标准的发展。随着当前硬件技术和软件技术的进步，Web标准页面的前景将变得更加光明。
本书读者对象
本书在内容安排上从浅入深，充分实例举证，非常适合需要使用CSS进行网页布局的网站开发
入门者，也可以作为网站开发者常备的一本CSS备查手册。本书适合以下类型的读者：
没有任何网站开发基础，欲学习网站开发的初学者。
有一定Web编程基础，欲学习使用CSS网页布局技术的初学者。
有丰富的Web编程经验，且经常要参与网站开发的Web程序员，本书可作为他们的常用参考手册。
本书内容结构
本书以Web 2.0版本作为讲解对象，从基本的语法和规范入手，以恰当的实例为导向，从浅入深介绍CSS技术的基本理论知识及应用系统开发的实践经验。本书一共3篇15章。分别如
下：
第一篇“CSS技术基础篇”包括第1到10章，主要讲解了CSS技术的基础知识。其中包括Web开发标准与网页网站制作介绍，HTML与XHTML基础知识，CSS基础与语法介绍，CSS基本应用知识，CSS网页布局，CSS布局属性介绍，CSS容器属性介绍，CSS文本设置知识，CSS的图片修饰知识。为读者步入后面的知识下坚实的基础。
第二篇“基本应用和提高篇”包括第11到13章，主要讲解了CSS技术的基本应用知识。内容包括CSS高级应用，CSS实战与技巧,不同浏览器的兼容性与解析，CSS可视化开发技术。在介绍过程中始终贯穿基础知识，使读者从实践中掌握真谛。
第三篇“综合实战篇”包括第14和15章，介绍了个人博客网站开发实例和企业网站开发实例的全过
程。读者通过本篇的学习可以完全掌握CSS囊括的所有新技术，能够真正体会到CSS新技术给开发人员带来的视觉冲击。读者通过本篇的实践性内容的学习后，完全可以走上工作岗位。
注：本书所用素材和代码请到www.broadview.com.cn下载。
致谢
本书由北京城市学院老师王大平编写，在编写过程中，温才燚，李振捷，管西京，宗杰，刘冉等提供了很大的帮助，在此，对他们表示衷心的感谢。由于时间仓促，加上作者水平有限，书中难免存在一些不足和错误之处，敬请读者见谅，本书的服务网站是http://www.cx-pub.com，读者遇到问题时可以到网站的相关论坛参与讨论。
目录

第1篇　CSS技术基础篇
第1章 Web开发标准与网页网站制作介绍
1.1 Web开发标准介绍......................... 3 
1.1.1 Web开发标准概述 ...................3 
1.1.2为什么要使用 
Web标准...............4 
1.2 CSS网页布局标准 .......................5 
1.3 认识网页和网站.......................... 8
1.3.1何谓网页 ...........................8
1.3.2何谓网站 ...........................9
1.4 网页的基本构成元素..................... 10 
1.5 网页的基本制作流程..................... 13
1.6 网站的基本制作流程..................... 14 
1.7 小结................................... 17
第2章 HTML与XHTML基础知识
2.1 HTML简介..............................19 
2.1.1 HTML概述........................ 19
2.1.2 HTML文档结构.................... 19
2.1.3 HTML语法基础 .................... 19
2.2 XHTML基础.............................21
2.2.1 XHTML概述....................... 21
2.2.2 XHTML的文档结构................. 21 
2.2.3 XHTML的基本元素................. 21
2.2.4了解 XHTML语法................... 23
2.3 HTML升级到XHTML ......................29
2.4 XHTML中的CSS应用 .....................32
2.5 正确使用XHTML标签 ....................35
2.6 小结..................................37
第3章CSS基础 
3.1 CSS概述...............................39 
3.2 基本语法..............................41 
3.3 选择符的使用..........................41 
3.4 CSS属性的简要介绍 ....................46 
3.5 元素简要介绍..........................47 
3.6 几个常用值............................48 
3.6.1颜色单位 .......................... 48 
3.6.2长度单位.......................... 50 
3.6.3百分比值 .......................... 51 
3.6.4 URL .............................. 51 
3.6.5 URL默认值 ........................ 52 
3.7 网页中的CSS应用 ......................52 
3.7.1页面调用 CSS方式................... 52 
3.7.2调用优先级 ........................ 55 
3.8 CSS的编码规范.........................59 
3.8.1书写规范.......................... 59 
3.8.2命名规范.......................... 60 
3.9 CSS调试...............................61 
3.10 CSS实用技巧..........................64 
3.11 小结.................................65
第4章CSS基本应用 
4.1 CSS页面头部元素........................ 67 
4.1.1选择文档类型 ...................... 67 
4.1.2命名空间.......................... 68 
4.1.3编码类型 .......................... 68 
4.1.4 meta标签 .......................... 68 
4.2 CSS声明方法............................ 71 
4.3 Style标签.............................. 74 
4.4 link与@import.......................... 75 
4.5 id与class.............................. 77 
4.6 小结................................... 78
第5章CSS网页布局 
5.1 网页布局概述........................... 80 
5.1.1网页分析和制作流程 ................ 80 
5.1.2网页布局理念...................... 81 
5.2 table布局.............................. 82 
5.3 认识div与span.......................... 86 
5.3.1 div与span概述 ...................... 86 
5.3.2 div与span的应用.................... 87 
5.4 div布局与table布局区别................. 90 
5.5 div与css联合应用....................... 92 
5.6 CSS布局技巧和排版心得.................. 95 
5.7 小结.................................. 100
第6章CSS布局属性 
6.1 CSS元素详解........................... 102 
6.2 元素的定位............................ 104 
6.2.1元素排列 ......................... 104 
6.2.2浮动属性定位..................... 108 
6.3 定位属性.............................. 109 
6.3.1定位模式......................... 109 
6.3.2边偏移........................... 109 
6.3.3层叠定位属性 ..................... 110 
6.3.4定位属性的应用................... 110 
6.4 基本内容控制属性...................... 117 
6.4.1 display属性........................ 117 
6.4.2 visibility属性....................... 119 
6.4.3 text-align属性..................... 120 
6.4.4 margin属性........................ 121 
6.5 页面背景控制.......................... 123 
6.5.1页面背景概述..................... 123 
6.5.2使用背景颜色..................... 123 
6.5.3使用背景图片..................... 123 
6.5.4背景颜色和背景图片混用........... 130 
6.5.5文本样式设置.................... 133 
6.5.6链接样式设置..................... 135 
6.6 使用浮动属性.......................... 137 
6.6.1浮动属性概述..................... 137 
6.6.2相邻固定元素..................... 137 
6.6.3相邻两个浮动元素................. 140 
6.6.4相邻多个浮动元素................. 141 
6.7 清除浮动属性.......................... 143 
6.7.1清除浮动属性概述................. 143 
6.7.2使用清除浮动属性................. 146 
6.8 UL和LI列表控制属性.................... 149 
6.8.1使用list-style-type属性............. 149 
6.8.2使用list-style-position属性.......... 151 
6.8.3使用list-style-image属性............ 153 
6.8.4使用list-style属性 .................. 155 
6.9 制作导航菜单.......................... 156 
6.9.1制作一个纵向导航菜单............. 156 
6.9.2制作一个横向导航菜单............. 164 
6.10 小结................................. 171
第7章定义容器属性 
7.1 CSS盒模型............................. 173 
7.1.1盒模型内容....................... 173 
7.1.2盒模型背景....................... 174 
7.2 使用补白属性.......................... 175 
7.2.1补白属性概述..................... 175 
7.2.2补白属性的百分比值............... 176 
7.2.3单侧补白属性..................... 178 
7.2.4实战技巧——简写补白属性......... 180 
7.3 使用边框属性.......................... 181 
7.3.1使用边框样式属性................. 182 
7.3.2使用边框宽度属性................. 184 
7.3.3使用边框颜色属性................. 187 
7.3.4综合使用边框属性................. 189 
7.3.5使用表格边框属性................. 191 
7.4 使用边界属性.......................... 193 
7.4.1边界属性介绍及使用............... 193 
7.4.2使用单侧边界属性................. 195
7.4.3相邻边界属性 ..................... 197
7.4.4在内联元素中使用边界属性 ......... 201 
7.5 父子元素距离.......................... 204
7.5.1如果子元素边界为0 ................ 204
7.5.2如果父元素补白为0 ................ 205 
7.6 嵌套元素使用负边界.................... 208
7.7 固定元素大小.......................... 210 
7.7.1计算盒模型大小................... 210 
7.7.2固定长度和宽度................... 211 
7.8 小结.................................. 212
第8章CSS文本设置 
8.1 文本的缩进和对齐...................... 214
8.1.1缩进段首......................... 214
8.1.2文本下沉与大写................... 216
8.1.3文本对齐......................... 218
8.1.4图文混排对齐处理................. 221
8.2 行高和间隔............................ 223
8.2.1使用行高属性..................... 223 
8.2.2文本间隔与空白................... 232
8.2.3文本转换......................... 238 
8.3 实现水平和垂直居中.................... 239 
8.3.1确定容器内容和大小............... 239 
8.3.2未知容器内容和大小............... 241
8.3.3确定容器大小而未知内容........... 243
8.3.4容器大小和内容都未知............. 246 
8.3.5背景图片水平垂直居中............. 250 
8.4 字体设置.............................. 251
8.4.1字体选择 ......................... 251 
8.4.2字体大小......................... 253 
8.4.3字体加粗......................... 257
8.4.4字体样式 ......................... 259
8.4.5字体转换......................... 260 
8.5 修饰和链接............................ 263 
8.5.1修饰文本......................... 263 
8.5.2修饰属性的继承................... 265 
8.5.3使用链接属性..................... 267 
8.5.4小技巧——掌握链接的顺序......... 273 
8.5.5链接的继承性..................... 275 
8.5.6设置鼠标悬停样式................. 276 
8.6 小结.................................. 277
第9章CSS中的图片 
9.1 常见图片格式.........................279 
9.1.1 GIF格式.......................... 279 
9.1.2 JPEG格式......................... 279 
9.2 图片的修饰...........................279 
9.2.1背景图片修饰..................... 280 
9.2.2内容图片修饰..................... 280 
9.3 制作一个图片圆角框..................285 
9.3.1单色单线圆角框的高度自适用....... 285 
9.3.2单色单线圆角框的宽度自适用....... 289 
9.3.3圆角框的完全自适用............... 294 
9.3.4复杂圆角框的高度自适用........... 298 
9.3.5复杂圆角框的完全自适用........... 301 
9.4 图片优化.............................305 
9.5 小结.................................307
第10章CSS高级应用 
10.1 应用自适用特性 .....................309 
10.1.1独立元素的自适用................ 309 
10.1.2使用背景色自适用................ 311 
10.1.3左右自适用的两列布局............ 313 
10.1.4某列固定时的自适用.............. 315 
10.1.5水平自适用...................... 320 
10.2 表单修饰............................323 
10.2.1修饰表单文本域.................. 324 
10.2.2修饰表单文本区域................ 325 
10.2.3修饰表单按钮.................... 327 
10.2.4修饰复选框...................... 328 
10.2.5修饰单选按钮.................... 329 
10.2.6修饰表单列表.................... 330 
10.2.7修饰表单文件域.................. 332 
10.2.8修饰表单图像域.................. 333 
10.3 修饰页面滚条........................334 
10.4 修饰表格............................336 
10.4.1修饰表格边线和背景.............. 336 
10.4.2设置表格的宽度和高度............ 337 
10.4.3实现表格的居中.................. 339 
10.4.4设置表格内容高度................ 340 
10.5 修饰水平线..........................341 
10.6 制作一个页面框架 ...................342 
10.6.1总体结构分析.................... 343 
10.6.2设计页面结构.................... 344 
10.6.3编写基础样式.................... 345 
10.6.4编写顶部样式.................... 346 
10.6.5编写菜单样式.................... 347 
10.6.6编写主体样式.................... 348 
10.6.7编写底部样式.................... 349 
10.7 制作登录框..........................350 
10.7.1设计页面结构.................... 351 
10.7.2编写基础样式.................... 352 
10.7.3编写背景样式.................... 353 
10.7.4编写表单样式.................... 354 
10.7.5编写底部按钮样式................ 355 
10.8 修饰导航栏..........................356 
10.8.1修饰纵向导航栏.................. 356 
10.8.2修饰导航栏链接.................. 358 
10.8.3修饰导航栏文本背景.............. 359 
10.8.4修饰横向导航栏.................. 362 
10.9 制作一个纵向下拉菜单...............364 
10.9.1设计页面结构.................... 365 
10.9.2编写基础样式.................... 366 
10.9.3编写主导航样式.................. 367 
10.9.4编写下拉栏目样式................ 368 
10.9.5编写隐藏样式.................... 369 
10.9.6编写显示样式.................... 370 
10.9.7编写脚本调用代码................ 370 
10.10 制作一个横向下拉菜单..............371 
10.10.1设计页面结构................... 373 
10.10.2编写主导航样式................. 374 
10.10.3编写下拉菜单样式............... 375 
10.10.4编写兼容样式................... 376 
10.10.5编写显示样式................... 376 
10.10.6编写脚本调用代码............... 376 
10.11 制作一个完整页面..................378 
10.11.1 Photoshop切片................... 379 
10.11.2设计上部导航部分............... 380 
10.11.3设计中间内容部分............... 384 
10.11.4设计底部版权部分............... 390 
10.12 小结...............................393
第2篇　基本应用和提高篇
第11章CSS实战与技巧 
11.1 制作复杂圆角框....................... 397 
11.1.1图片圆角框...................... 397 
11.1.2纯CSS圆角框..................... 400 
11.2 滑动门设计........................... 404 
11.3 切换网站样式......................... 408 
11.3.1设计页面结构.................... 409 
11.3.2编写不同样式.................... 410 
11.3.3页面脚本调用.................... 413 
11.4 实现柱形图........................... 415 
11.4.1进度条效果...................... 415 
11.4.2统计柱形图...................... 418 
11.5 Flash应用............................ 423 
11.5.1设计页面结构.................... 423 
11.5.2编写设置样式.................... 424 
11.5.3编写脚本调用程序................ 426 
11.5.4插入Flash ........................ 427 
11.5.5消除遮盖........................ 428 
11.6隐藏显示标签页....................... 428 
11.6.1设计页面结构.................... 429 
11.6.2编写整体样式.................... 430 
11.6.3编写标题样式.................... 431 
11.6.4编写列表样式.................... 432 
11.6.5编写链接样式.................... 432 
11.6.6编写悬停样式.................... 433 
11.7特效处理............................. 434 
11.7.1准备页面素材.................... 435 
11.7.2设计页面结构.................... 435 
11.7.3编写链接样式.................... 436 
11.7.4编写悬停样式.................... 437 
11.8小提示窗口........................... 438 
11.8.1功能介绍........................ 438 
11.8.2设计页面结构.................... 439 
11.8.3编写整体样式.................... 440 
11.8.4 编写提示标记样式................ 440 
11.8.5编写显示提示样式................ 440 
11.9JavaScript应用....................... 441 
11.9.1 JavaScript概述.................... 442 
11.9.2 JavaScript应用实例................ 442 
11.10小结................................ 447
第12章不同浏览器的兼容性解析 
12.1 浏览器兼容性介绍 ...................449 
12.1.1常用浏览器介绍.................. 449 
12.1.2遵循的原则...................... 449 
12.2使用!important .....................450 
12.3解决水平居中问题 ...................452 
12.4解决非浮动内容和容器的问题.........454 
12.5解决浮动问题........................457 
12.6默认宽度的并列浮动元素.............460 
12.7嵌套元素的叠加问题.................462 
12.7.1嵌套元素均没有定义宽度和高度.... 462 
12.7.2设置子元素宽度.................. 463 
12.7.3设置父元素宽度.................. 464 
12.7.4解决方法........................ 466 
12.8 子元素的负边界问题.................470 
12.9 列表默认显示问题 ...................472 
12.9.1列表默认显示问题介绍............ 472 
12.9.2取消列表默认显示问题............ 474 
12.10 IE 6.0的识别问题..................475 
12.10.1浮动元素的双边距问题........... 475 
12.10.2浮动元素的零边距问题........... 477 
12.10.3解决方法....................... 477 
12.10.4浮动列表问题................... 479 
12.10.5图片空隙问题................... 481 
12.11 IE 7.0的识别问题..................483 
12.11.1 !important支持................... 483 
12.11.2内容和容器的关系............... 483 
12.11.3嵌套问题....................... 485 
12.11.4浮动子元素问题................. 487 
12.12 Opera下的CSS技巧..................489 
12.13 常见兼容性技巧....................490 
12.14 小结..............................492
第13章　CSS可视化开发 
13.1 可视化开发工具介绍.................494 
13.1.1 Frontpage介绍.................... 494 
13.1.2 Dreamweaver介绍................. 495 
13.2Frontpage中的CSS可视化开发.........498 
13.3Dreamweaver中的CSS可视化开发.......502 
13.4Visual Studio 2005中的CSS可视化开发............................... 505 
13.5Developer Toolbar使用介绍..........508 
13.5.1 Developer Toolbar的安装........... 509 
13.5.2 Developer Toolbar使用概要......... 510 
13.6 小结................................511 
第3篇　综合实战篇
第14章　个人博客网站开发实例 
14.1 网站规划............................515 
14.1.1站点需求分析.................... 515 
14.1.2预期效果分析.................... 515 
14.1.3站点结构规划.................... 517 
14.2 切图分析............................517 
14.3 制作站点首页........................518 
14.3.1实现流程分析.................... 518 
14.3.2制作顶部导航.................... 519 
14.3.3设计中间内容部分................ 523 
14.3.4制作底部版权部分................ 529 
14.4 制作日志页面........................531 
14.4.1实现流程分析.................... 532 
14.4.2日志内容实现 .................... 532 
14.5 制作日志详情页面 ...................533 
14.5.1实现流程分析.................... 534 
14.5.2页面具体实现.................... 534 
14.6 小结................................538
第15章　企业网站开发实例 
15.1 网站规划............................540 
15.1.1站点需求分析.................... 540 
15.1.2预期效果分析.................... 540 
15.1.3页布局分析...................... 542 
15.2 切图分析............................542 
15.3 首页实现............................543 
15.3.1实现流程分析.................... 543 
15.3.2制作页面头部.................... 543 
15.3.3制作页面主体.................... 547 
15.3.4制作页面底部.................... 556 
15.3.5解决兼容性问题.................. 557 
15.4 二级页面实现........................558 
15.5 小结................................560