第1部分 CSS核心原理 2
第1章 （X）HTML与CSS概述 2
1．1网页的基础概念 2
1．2 Web标准 3
1．2．1标准的重要性 3
1．2．2 “Web标准”概述 4
1．3 HTML与XHTML 5
1．3．1追根溯源 5
1．3．2文档类型的含义与选择 6
1．3．3 XHTML与HTML的重要区别 7
1．4（X）HTML与CSS 8
1．4．1 CSS标准 8
1．4．2传统HTML的缺点 9
1．4．3 CSS的引入 10
1．4．4如何编辑CSS 11
1．4．5浏览器与CSS 12
小结 13
习题 13
第2章 CSS选择器与相关特性 14
2．1构造CSS规则 14
2．2基本CSS选择器 15
2．2．1标记选择器 15
2．2．2类别选择器 16
2．2．3 ID选择器 18
2．3在HTML中使用CSS的方法 19
2．3．1行内式 20
2．3．2内嵌式 20
2．3．3链接式 21
2．3．4导入式 22
2．4复合选择器 24
2．4．1交集选择器 24
2．4．2并集选择器 25
2．4．3后代选择器 27
2．5 CSS的继承特性 29
2．5．1继承关系 29
2．5．2 CSS继承的运用 30
2．6 CSS的层叠特性 32
小结 34
习题 34
第3章 CSS设计实践 35
3．1手工方式编写页面 35
3．1．1构建页面框架 35
3．1．2设置标题 36
3．1．3控制图片 37
3．1．4设置正文 38
3．1．5设置整体页面 38
3．1．6对段落进行分别设置 39
3．1．7完整代码 40
3．1．8 CSS的注释 41
3．2使用Dreamweaver进行CSS设置 41
3．2．1创建页面 41
3．2．2新建CSS规则 42
3．2．3编辑CSS规则 44
3．2．4为图像创建CSS规则 45
小结 47
习题 47
第4章 CSS盒子模型 48
4．1“盒子”与“模型”的概念探究 48
4．2长度单位 49
4．3边框 50
4．3．1设置边框样式 51
4．3．2属性值的简写形式 52
4．3．3边框与背景 54
4．4设置内边距 55
4．5设置外边距 56
4．6盒子之间的关系 57
4．6．1 HTML与DOM 57
4．6．2标准文档流 60
4．6．3 <div>标记与<span>标记 62
4．7盒子在标准流中的定位原则 64
4．7．1行内元素之间的水平margin 64
4．7．2块级元素之间的竖直margin 65
4．7．3嵌套盒子之间的margin 66
4．7．4 margin属性可以设置为负值 68
4．8盒子模型概念的实例 69
小结 72
习题 72
第5章 盒子的浮动与定位 73
5．1盒子的浮动 73
5．1．1制作基础页面 73
5．1．2设置第1个浮动的div 75
5．1．3设置第2个浮动的div 75
5．1．4设置第3个浮动的div 76
5．1．5改变浮动的方向 76
5．1．6再次改变浮动的方向 76
5．1．7全部向左浮动 77
5．1．8使用clear属性清除浮动的影响 78
5．1．9扩展盒子的高度 79
5．2盒子的定位 80
5．2．1静态定位 80
5．2．2相对定位 81
5．2．3绝对定位 84
5．2．4固定定位 89
5．3 z-index空间位置 89
5．4盒子的display属性 90
小结 91
习题 91
第2部分 CSS专题技术 94
第6章 用CSS设置文本和图像 94
6．1使用CSS设置文本样式 94
6．1．1创建基础页面 94
6．1．2设置文字的字体 95
6．1．3设置文字的倾斜效果 95
6．1．4设置文字的加粗效果 96
6．1．5转换英文字母大小写 97
6．1．6控制文字的大小 98
6．1．7设置文字装饰效果 99
6．1．8设置段落首行缩进 100
6．1．9设置字词间距 101
6．1．10设置段落内部的文字行高 101
6．1．11设置段落之间的距离 102
6．1．12控制文本的水平位置 103
6．1．13设置文字与背景的颜色 103
6．2用CSS设置图像样式 104
6．2．1设置图片边框 105
6．2．2图片缩放 107
6．2．3图文混排 108
6．2．4制作八大行星科普网页实例 110
6．2．5设置图片与文字的对齐方式 113
6．3用CSS设置背景样式 117
6．3．1设置背景颜色 117
6．3．2设置背景图像 118
6．3．3设置背景图像平铺 119
6．3．4设置背景图像位置 121
6．3．5固定背景图片位置 123
6．3．6设置标题的图像替换 124
小结 127
习题 127
第7章 用CSS设置超链接与导航菜单 128
7．1制作丰富的超链接特效 129
7．2创建按钮式超链接 131
7．3制作荧光灯效果的菜单 132
7．3．1创建HTML框架 133
7．3．2设置容器的CSS样式 133
7．3．3设置菜单项的CSS样式 134
7．4控制鼠标指针 136
7．5设置项目列表样式 136
7．5．1列表的符号 137
7．5．2图片符号 139
7．6创建基于列表的导航菜单 140
7．6．1简单的竖直排列菜单 140
7．6．2横竖自由转换菜单 143
7．7应用滑动门技术的玻璃效果菜单 143
7．7．1基本思路 144
7．7．2设置菜单整体效果 145
7．7．3使用“滑动门”技术设置玻璃材质背景 146
7．7．4后续问题 147
小结 148
习题 148
第8章 用CSS设置表格和表单样式 149
8．1控制表格 149
8．1．1设置表格的边框 149
8．1．2确定表格的宽度 152
8．1．3其他与表格相关的标记 152
8．2美化表格 153
8．2．1搭建HTML结构 154
8．2．2整体设置 155
8．2．3设置单元格样式 155
8．2．4斑马纹效果 156
8．3制作日历 157
8．3．1搭建HTML结构 158
8．3．2设置整体样式和表头样式 159
8．3．3设置日历单元格样式 160
8．4 CSS与表单 163
8．4．1表单中的元素 163
8．4．2多彩的下拉菜单 166
8．5网民调查问卷实例 167
小结 169
习题 169
第9章 圆角设计 170
9．1圆角框的作用 170
9．2固定宽度圆角框 171
9．2．1两背景图像法 171
9．2．2使用透明背景图 174
9．3不固定宽度的圆角框 175
9．3．1不固定宽度圆角框的含义 175
9．3．2“4图像”单色不固定宽度圆角框 176
9．4“5图像”二维滑动门经典圆角框 178
9．4．1准备图像 179
9．4．2搭建HTML结构 180
9．4．3放置背景图像 182
9．4．4设置样式并修复缺口 183
9．4．5在整体页面中使用圆角框 184
9．4．6实现网页换肤 186
小结 189
习题 189
第10章 网页样式综合案例——灵活的电子相册 190
10．1搭建框架 190
10．2阵列模式 192
10．3单列模式 196
10．4改进阵列模式 198
10．5 IE6兼容 201
小结 203
习题 203
第3部分 CSS页面布局 206
第11章 固定宽度布局剖析与制作 206
11．1向报纸学习排版思想 206
11．2 CSS排版观念 208
11．2．1两列布局 208
11．2．2三列布局 209
11．2．3多列布局 210
11．2．4布局结构的表达式与结构图 211
11．3单列布局 214
11．3．1放置第一个圆角框 215
11．3．2设置圆角框的CSS样式 215
11．3．3放置其他圆角框 218
11．4 “1-2-1”固定宽度布局 219
11．4．1创建基本代码 219
11．4．2绝对定位法 221
11．4．3浮动法 222
11．5 “1-3-1”固定宽度布局 225
11．6 “1-（（1-2）＋1）-1”固定宽度布局 226
小结 227
习题 227
第12章 变宽度网页布局剖析与制作 228
12．1 “1-2-1”变宽度网页布局 228
12．1．1 “1-2-1”等比例变宽布局 228
12．1．2 “1-2-1”单列变宽布局 230
12．2 “1-3-1”宽度适应布局 234
12．2．1 “1-3-1”三列宽度等比例布局 234
12．2．2 “1-3-1”单侧列宽度固定的变宽布局 234
12．2．3 “1-3-1”中间列宽度固定的变宽布局 235
12．2．4进一步思考 237
12．2．5 “1-3-1”双侧列宽度固定的变宽布局 238
12．2．6 “1-3-1”中列和侧列宽度固定的变宽布局 240
12．3变宽布局方法总结 240
12．4分列布局背景色问题 241
12．5 CSS布局与传统的表格方式布局的分析 245
小结 247
习题 247
第4部分 综合案例 250
第13章 综合案例——儿童用品网上商店 250
13．1案例概述 250
13．2内容分析 251
13．3 HTML结构设计 252
13．4原型设计 255
13．5页面方案设计 258
13．6布局设计 258
13．6．1整体样式设计 258
13．6．2页头部分 259
13．6．3内容部分 262
13．6．4页脚部分 264
13．7细节设计 265
13．7．1页头部分 265
13．7．2内容部分 270
13．7．3左侧的主要内容列 270
13．7．4右边栏 273
13．8 CSS布局的优点 276
13．9交互效果设计 277
13．9．1次导航栏 277
13．9．2主导航栏 278
13．9．3账号区 278
13．9．4图像边框 279
13．9．5产品分类 280
13．10遵从Web标准的设计流程 281
小结 282
习题 282
第14章 综合案例——博客网站 283
14．1分析构架 283
14．1．1设计分析 283
14．1．2排版构架 284
14．2模块拆分 285
14．2．1导航与Banner 285
14．2．2左侧列表 287
14．2．3内容部分 290
14．2．4 footer脚注 292
14．3整体调整 292
小结 293
习题 293
第15章 综合案例——旅游门户网站 294
15．1分析构架 294
15．1．1设计分析 294
15．1．2排版构架 295
15．2模块拆分 296
15．2．1 Banner图片与导航菜单 296
15．2．2左侧分栏 297
15．2．3中部主体 299
15．2．4右侧分栏 301
15．2．5脚注 302
15．3最终效果 303
小结 304
习题 304