第1篇 CSS布局基础知识 1
第1章 网页开发必备基础 2
1.1 网页文档与网页浏览器 3
1.2 网页文档的类型 4
1.2.1 什么是HTML文档 4
1.2.2 什么是XHTML文档 5
1.2.3 XHTML的页面结构 6
1.2.4 XHTML的书写格式 6
1.2.5 XHTML的语法规范 6
1.3 初识CSS——层叠样式表 7
1.4 选择合适的开发工具 8
1.4.1 TopStyle——CSS开发编辑器 8
1.4.2 Dreamweaver——网页开发编辑器 9
1.5 小结 12
第2章 CSS初体验——编写一个简单的网页文档 13
2.1 编写XHTML文档 14
2.1.1 使用Dreamweaver新建一个XHTML框架文档 14
2.1.2 手工编写XHTML文档 16
2.2 在XHTML文档中使用CSS样式的方法 16
2.2.1 行内样式 16
2.2.2 内嵌式 18
2.2.3 链接式 19
2.2.4 导入样式 21
2.2.5 样式的优先级 21
2.3 初探CSS语句 22
2.3.1 CSS语句的结构 23
2.3.2 CSS语句样式的工作原理 23
2.3.3 CSS基本书写规范 24
2.3.4 使用有意义的CSS命名 24
2.3.5 CSS样式表书写顺序 26
2.4 合理的CSS注释 26
2.5 小结 27
第3章 CSS的基本语法知识 28
3.1 选择器 29
3.1.1 标签选择器 29
3.1.2 类选择器 30
3.1.3 ID选择器 32
3.1.4 全局选择器 33
3.1.5 组合选择器 34
3.1.6 继承选择器 36
3.1.7 伪类与伪元素 39
3.2 声明 40
3.2.1 多重声明 41
3.2.2 集体声明 41
3.3 CSS的层叠原理 43
3.3.1 CSS样式来源 43
3.3.2 选择器的优先级 43
3.3.3 ！important 语句 45
3.3.4 顺序优先级 46
3.3.5 CSS的层叠规则 47
3.4 颜色单位 48
3.4.1 颜色名称 48
3.4.2 百分比颜色 49
3.4.3 数字颜色 51
3.4.4 十六进制颜色 51
3.5 长度单位 53
3.5.1 绝对单位 53
3.5.2 相对单位 54
3.6 URL 56
3.6.1 绝对URL 56
3.6.2 相对URL 56
3.7 继承性 57
3.8 小结 57
第2篇 CSS页面布局技巧 59
第4章 设置文本样式 60
4.1 字体类型 61
4.2 字体大小设置 62
4.2.1 相对大小定义 63
4.2.2 绝对大小定义 66
4.3 字体加粗 68
4.4 字体颜色 70
4.5 斜体 71
4.6 下画线、顶画线和删除线 72
4.7 英文字母大小写 74
4.8 文本的复合属性 76
4.9 文字的段落样式 76
4.9.1 段落的水平对齐方式 76
4.9.2 段落的垂直对齐方式 77
4.9.3 首行缩进 80
4.9.4 行间距与字间距 81
4.10 实例：简单的文章页面 85
4.11 小结 88
第5章 在页面内添加图片 89
5.1 在网页中插入图片 90
5.2 控制图片的大小 91
5.2.1 设置图片的固定大小 91
5.2.2 使用百分比控制图片的宽和高 92
5.2.3 单独控制图片的宽度或高度 93
5.3 为图片设置边框效果 94
5.4 图片与文本混排 95
5.5 图片无法显示 98
5.6 给图片增加链接 99
5.7 小结 100
第6章 设置页面背景 101
6.1 设置页面元素的背景色 102
6.2 设置背景图片 103
6.2.1 设置页面元素的背景图片 103
6.2.2 背景图的平铺 104
6.2.3 背景图的位置 106
6.2.4 滚动和固定的背景图 110
6.3 背景颜色和背景图片的层叠 112
6.4 背景属性 112
6.4.1 背景属性缩写 112
6.4.2 背景属性在内联元素中的使用 113
6.5 利用图片设置圆角背景 114
6.5.1 背景图片自适应高度 114
6.5.2 背景图片自适应宽度 116
6.5.3 背景图片的完全自适应 117
6.6 小结 120
第7章 用CSS控制超链接样式 121
7.1 链接的属性详解 122
7.2 链接的设置顺序与继承性 122
7.2.1 使用链接的顺序 123
7.2.2 链接的继承性 124
7.3 丰富超链接的表现形式 126
7.3.1 通过不同的链接效果显示各种状态 126
7.3.2 超链接翻转效果 129
7.4 小结 132
第8章 列表样式 133
8.1 列表的类型 134
8.1.1 无序列表 134
8.1.2 有序列表 136
8.1.3 定义列表 137
8.2 改变列表符的样式 138
8.2.1 使用自带的列表符 138
8.2.2 用背景图片改变列表符 141
8.2.3 改变列表符的位置 142
8.2.4 列表属性的简写 143
8.3 小结 143
第9章 用CSS美化表格 144
9.1 表格的基本页面元素 145
9.2 使用CSS控制表格元素 148
9.2.1 设置表格的大小 148
9.2.2 表格边框的分开与合并 149
9.2.3 表格内的文字位置 149
9.3 控制表格的边线和背景 151
9.4 小结 152
第10章 用CSS控制表单样式 153
10.1 表单的基本元素 154
10.1.1 form标签和 fieldset标签 154
10.1.2 表单域的种类 155
10.2 美化fieldset标签 156
10.3 美化表单域 158
10.3.1 美化文本框 158
10.3.2 美化下拉列表 159
10.3.3 美化提交按钮 160
10.4 小结 161
第11章 CSS滤镜的应用 162
11.1 滤镜概述 163
11.2 透明层次滤镜（alpha） 163
11.2.1 使用参数opacity 163
11.2.2 使用参数style 164
11.3 颜色透明滤镜（chroma） 167
11.4 模糊滤镜（blur） 168
11.5 固定阴影滤镜（dropshadow） 170
11.6 移动阴影滤镜（shadow） 171
11.7 光晕滤镜（glow） 172
11.8 灰度滤镜（gray） 173
11.9 反色滤镜（invert） 174
11.10 镜像滤镜（flip） 175
11.11 遮罩滤镜（mask） 176
11.12 x射线滤镜（x-ray） 177
11.13 波纹滤镜（wave） 178
11.14 小结 179
第12章 浏览器兼容问题 180
12.1 浏览器的种类及其兼容原则 181
12.2 解决兼容问题的原理 182
12.3 !important的使用 182
12.4 水平居中的问题 184
12.4.1 IE 6.0 中的水平居中 184
12.4.2 Firefox 17.0 中的水平居中 185
12.4.3 解决方法 186
12.5 列表的默认显示问题 186
12.5.1 列表的默认显示方式 186
12.5.2 默认属性的取消 187
12.6 非浮动内容和容器的问题 189
12.6.1 IE 6.0中固定宽度和高度的容器和内容 189
12.6.2 Firefox 17.0 中的容器与内容 190
12.6.3 超出容器的内容可能出现的问题和解决方法 190
12.7 使用:after伪类解决浮动的问题 192
12.7.1 IE 6.0中的浮动元素和容器 192
12.7.2 Firefox 17.0 中的浮动元素和容器 193
12.7.3 使用:after伪类清除浮动 193
12.7.4 并列浮动元素默认宽度的问题 195
12.8 嵌套元素宽度和高度叠加的问题 196
12.8.1 父元素和子元素均没有定义宽度和高度 196
12.8.2 定义子元素宽度后的效果 197
12.8.3 定义父元素宽度后的效果 198
12.8.4 解决的方法 198
12.9 小结 204
第3篇 DIV＋CSS布局 205
第13章 DIV＋CSS布局基础 206
13.1 初识DIV＋CSS布局的流程 207
13.2 了解盒模型 209
13.2.1 div标签的盒模型示例 210
13.2.2 基本盒模型 213
13.2.3 边距 214
13.2.4 边框 219
13.2.5 补白 223
13.3 块级元素与行内元素 225
13.4 CSS的浮动布局 227
13.4.1 两个元素的浮动应用 227
13.4.2 多个元素的浮动应用 230
13.4.3 清除浮动 231
13.4.4 解决Firefox的计算高度问题 232
13.5 CSS布局的相对定位 235
13.5.1 单个元素的相对定位 235
13.5.2 两个元素的相对定位 238
13.6 CSS布局方式：绝对定位 240
13.6.1 单个元素的绝对定位 240
13.6.2 两个元素的绝对定位 241
13.7 小结 243
第14章 CSS页面基本排版技术 244
14.1 固定宽度布局 245
14.1.1 一列水平居中布局 245
14.1.2 两列浮动布局 248
14.1.3 三列浮动布局 253
14.2 自适应宽度布局 258
14.2.1 两列布局：两列自适应宽度 258
14.2.2 两列布局：左列固定，右列自适应 261
14.2.3 三列布局：中间列自适应 263
14.3 复杂的页面排版 266
14.3.1 复杂的页面排版：垂直布局 266
14.3.2 复杂的页面排版：水平布局 273
14.4 小结 278
第4篇 整站的CSS定义技巧 279
第15章 关于整站样式表的分析 280
15.1 站点页面的分析 281
15.1.1 规划样式表的原则 281
15.1.2 规划样式表的方法 281
15.1.3 实例分析 282
15.2 站点二级页面的制作 283
15.2.1 日志内容页面结构的规划 283
15.2.2 日志内容页面CSS部分的制作 284
15.2.3 日志列表页的制作 287
15.3 小结 289
第16章 关于标准的校验 290
16.1 为什么要进行标准的校验 291
16.2 怎样进行标准的校验 291
16.2.1 XHTML校验的方法 291
16.2.2 CSS校验的方法 294
16.2.3 XHTML校验常见错误 294
16.2.4 CSS校验常见错误 295
16.3 实例页面的校验 295
16.3.1 实例首页的校验 295
16.3.2 一个二级页面的校验 297
16.4 小结 298
第5篇 实例制作 299
第17章 使用Dreamweaver制作中文网站 300
17.1 分析效果图 301
17.2 制作首页的切图 302
17.3 制作站点首页头部 303
17.3.1 首页头部的信息和基础样式的制作 303
17.3.2 首页头部的分析 305
17.3.3 首页头部logo和banner部分的制作 305
17.3.4 导航列表的制作 309
17.4 制作首页的主体部分 312
17.4.1 分析主体部分效果图 312
17.4.2 制作主体部分的父元素 313
17.4.3 制作主体左侧部分的样式 313
17.4.4 制作主体右侧内容中关于我们的部分 317
17.4.5 制作新闻中心部分 319
17.4.6 制作产品介绍部分和资质荣誉部分 321
17.4.7 制作合作伙伴部分 323
17.5 制作首页的底部 324
17.6 首页的兼容问题 325
17.7 二级页面的制作 326
17.8 小结 329