第一篇 CSS零基础入门 1
第1章 CSS概述 1
1.1CSS是什么 1
1.1.1什么是Cascade 2
1.1.2层叠的样式 2
1.1.3表的作用 2
1.2CSS的发展历程 3
1.2.1关于HTML 3
1.2.2设计HTML的目的 4
1.2.3HTML的特点 4
1.2.4CSS的传奇历程 4
1.3建立网站和浏览网站 5
1.3.1什么是服务 5
1.3.2服务的场所 6
1.3.3创建服务场所——建立网站 6
1.3.4创建服务内容——网页的上传 7
1.3.5开启网页发布服务 8
1.3.6用户浏览网站的过程 9
1.4CSS在网站开发框架中的地位 10
1.5制作CSS需要考虑的问题 11
1.5.1对于不同用户的照顾 11
1.5.2对于不同浏览器的照顾 12
1.5.3对于网站浏览速度的关注 12
1.6小结 13
第2章 CSS初体验 14
2.1实验一:寻找CSS 14
2.1.1浏览器与网页的外观 14
2.1.2找到样式表 15
2.1.3先模仿后进步 16
2.2CSS分类及其创建方法 16
2.2.1CSS的3个种类 16
2.2.2在Dreamweaver中创建CSS——利用Dreamweaver提供的模板 17
2.2.3在Dreamweaver中创建CSS——自定义创建 18
2.3实验二:你的第1个样式表 20
2.3.1使用行内样式表 20
2.3.2使用内部样式表 21
2.3.3使用外部样式表 23
2.3.4各种样式表的优先级 25
2.4小结 26
第3章 开启CSS的大门 27
3.1背景让HTML页面更漂亮 27
3.1.1控制网页的背景 27
3.1.2HTML的颜色表示方法 28
3.1.3如何获取屏幕颜色 28
3.1.4网页文件的路径 30
3.1.5控制页面上的文字 33
3.1.6给文字增加更多效果 35
3.2文本的排版 35
3.2.1文本的缩进 36
3.2.2文本的对齐 37
3.2.3改变文本字符间距 40
3.2.4文字的其他设置 41
3.3关于HTML的链接 43
3.3.1链接和A标签 43
3.3.2A标签的实例 44
3.3.3A标签的几种状态 45
3.4利用图片丰富HTML外观 45
3.4.1在网页中插入图片 45
3.4.2网页中能显示所有图片吗 46
3.4.3改进图片的显示——给图片镶边 47
3.4.4防止图片被盗用的一个技巧 48
3.4.5实验:制作一页包含图文的电子简历 50
3.5小结 52
第4章 学习一点CSS的语法 54
4.1再访HTML 54
4.1.1组成HTML页面的细胞——标签 54
4.1.2CSS规则的具体写法 54
4.1.3标签应用CSS规则的具体写法 56
4.1.4CSS选择器的种类——8种武器 58
4.1.5伪类 68
4.1.6伪类的排列顺序 69
4.2盒模型 70
4.2.1块元素、内联元素和可变元素 70
4.2.2盒模型概述 73
4.3文档类型 74
4.4小结 75
第5章 组织:熟悉Span与Div 77
5.1属性与事件 77
5.1.1什么是属性 77
5.1.2属性的种类:基本属性、扩展属性 78
5.1.3什么是事件 79
5.1.4特别的属性:事件属性 79
5.2Span是什么 81
5.2.1Span有名字——ID属性 81
5.2.2Span的所在班级——Class属性 82
5.2.3Span的职务——Title属性 85
5.2.4Span的外貌——Style属性 89
5.2.5Span的Dir属性 90
5.2.6Span能说方言——Lang属性 91
5.2.7鼠标左键发生的事情——OnClick/OnDblClick 92
5.2.8其他的事件 94
5.3Div标签 94
5.3.1Div标签与Span标签的区别 95
5.3.2Div标签的属性 96
5.4小结 96
第6章 装载数据的擎天柱——表格 97
6.1表格的外观与结构 97
6.2再访盒模型:单元格 99
6.2.1再访盒模型 99
6.2.2修改盒子的宽度 99
6.2.3单元格的重要属性 104
6.3表格的边框 107
6.3.1表格边框的两种模式 107
6.3.2设置边框的颜色、类型、粗细 108
6.3.3表格边框的其他属性 110
6.3.4边框样式规则的冲突问题 110
6.4表格的外边距 111
6.5表格家族的其他标签 111
6.5.1行标签 111
6.5.2表头标签 112
6.5.3表内容标签 112
6.5.4表格题目标签 114
6.6实验:设计并实现颜色交替的表格 114
6.6.1简单的需求分析 114
6.6.2代码实现 114
6.6.3进一步思考 118
6.7小结 118
第7章 表单 119
7.1表单家族介绍 119
7.1.1form标签 119
7.1.2表单如何提交 120
7.1.3form标签在浏览器中的外观 120
7.1.4形形色色的输入标签 121
7.1.5表单家族各成员标签的特点 124
7.1.6表单家族各成员标签的事件 125
7.2表单与样式表 125
7.2.1清除form标签前后的空白 126
7.2.2设置丰富背景色的选择框 128
7.2.3设置input标签的边框 131
7.2.4动态改变文本输入框的背景 131
7.2.5关于表单各标签的快捷键 133
7.3小结 134
第8章 CSS与网页打印 135
8.1CSS样式中的媒体 135
8.1.1如何按照媒体类型区分样式 135
8.1.2不同媒体类型下的样式是否可以共享 136
8.2实验:制作适合打印的在线报名网页 136
8.2.1案例背景 136
8.2.2网页总体设计 137
8.2.3〈fieldset〉标签 139
8.2.4实现报名网页内容的分区 140
8.2.5实现平面按钮和文本框 141
8.2.6网页代码实现——打印报名部分 143
8.2.7精简含有@media设置的样式表 147
8.3小结 148
第二篇 CSS滤镜、风格与定位 149
第9章 CSS滤镜介绍 149
9.1CSS滤镜概述 149
9.1.1滤镜的编写规范与分类 149
9.1.2在网页中增加滤镜 150
9.2透明度的问题:Alpha通道 151
9.2.1Alpha滤镜的属性设置 151
9.2.2Alpha滤镜的实际例子 152
9.3朦胧的美:blur 153
9.4增加透明色效果(Chroma) 155
9.5下落的阴影(DropShadow) 157
9.6浮雕纹理(Emboss和Engrave) 158
9.7给元素增加一些翻转变换(Flip) 159
9.8关于灰度(Gray) 161
9.9霓虹灯:设置光晕(Glow) 163
9.10独特的效果:反色(Invert) 164
9.11面纱与遮罩(Mask) 165
9.12运动模糊(MotionBlur) 166
9.12.1运动模糊滤镜的主要参数 166
9.12.2不同Blur效果的比较 167
9.13让元素更立体:增加阴影(Shadow) 169
9.14X射线效果(XRay) 169
9.15给文字增加波浪(Wave) 170
9.16基本图形滤镜(BasicImage) 171
9.17动态滤镜 174
9.17.1转移滤镜的种类 175
9.17.2Barn滤镜 175
9.17.3动态滤镜的特别写法 177
9.17.4RevealTrans动态滤镜 177
9.17.5RevealTrans滤镜在网页切换中的应用 179
9.18背景滤镜 180
9.18.1PNG图片格式 180
9.18.2AlphaImageLoader滤镜 181
9.18.3Gradient滤镜 181
9.19小结 182
第10章 CSS风格的继承 183
10.1有其父必有其子:继承与面向对象 183
10.2查看继承关系的工具 184
10.3CSS中的继承 186
10.3.1文字样式的继承 189
10.3.2边距的继承 190
10.4标签的继承性 194
10.5小结 196
第11章 浮动与定位 197
11.1浮动属性初探 197
11.1.1设置Float属性的语法 197
11.1.2用Float属性设置图文环绕 197
11.2浮动属性详解 199
11.2.1文档流 199
11.2.2浮动属性的特点与实现过程 200
11.2.3浮动标签的折行显示 201
11.2.4Float属性的影响范围 203
11.2.5多幅图片与文字的环绕 204
11.2.6利用Clear属性清除浮动 207
11.2.7Float标签的左右逢源 209
11.2.8Float标签与宽度设定 210
11.2.9背景边框与Float标签 211
11.3定位技术 213
11.3.1定位技术以及它的分类 213
11.3.2绝对定位 213
11.3.3相对定位 214
11.3.4固定定位 215
11.4小结 217
第12章 层次堆叠与隐藏 218
12.1使网页变成三维立体的z-index 218
12.1.1z-index属性简介 219
12.1.2堆叠上下文(stackcontext) 221
12.1.3代码顺序和显示顺序 224
12.1.4层叠的应用举例 225
12.2控制标签的显示与隐藏 229
12.2.1Display属性 229
12.2.2Visibility属性 230
12.3小结 232
第13章 利用CSS+Div进行网页布局和排版 233
13.1表格还是Div 233
13.1.1利用表格进行网页布局 233
13.1.2利用Div+CSS进行网页布局 234
13.2用Div+CSS创建一列式网页布局 234
13.2.1创建一列式布局 235
13.2.2代码解读 237
13.2.3观察与思考:3个问题 238
13.2.4解决Div内容垂直居中的问题 239
13.2.5解决IE7浏览器中底部Div突出的问题 241
13.2.6设置Body居中的技巧 242
13.3用Div+CSS创建两列式网页布局 243
13.3.1创建基本的两列式布局 243
13.3.2设置固定宽度的两列式布局 249
13.4用Div+CSS创建多列式网页布局 249
13.5用Div+CSS创建不规则网页布局 255
13.6小结 256
第三篇 CSS实战布局 257
第14章 利用Dreamweaver进行CSS设计 257
14.1Dreamweaver介绍 257
14.1.1如何获得DreamweaverCS3 258
14.1.2DreamweaverCS3的安装过程 260
14.1.3DreamweaverCS3操作界面介绍 260
14.1.4DreamweaverCS3的代码编辑技巧 263
14.2在Dreamweaver中创建CSS 266
14.2.1创建样式表 266
14.2.2创建外部样式表 267
14.2.3创建内部样式表 269
14.2.4创建行内样式表 270
14.3在Dreamweaver中详细设置CSS规则 271
14.3.1设置字体类型 272
14.3.2设置背景 272
14.3.3设置块元素样式 273
14.3.4设置盒模型标签样式 274
14.3.5设置边框样式 274
14.3.6设置列表样式 275
14.3.7设置标签定位 276
14.3.8设置扩展效果 276
14.3.9完成CSS设置 277
14.3.10应用CSS样式规则 279
14.3.11使用CSS样式范例 280
14.4小结 281
第15章 页面CSS技巧运用实例 282
15.1修改滚动条显示效果 282
15.1.1滚动条的结构 282
15.1.2通过样式表来修改滚动条的外观 283
15.2利用Clip属性进行剪裁 284
15.2.1Clip属性 284
15.2.2利用Clip属性裁剪图片 284
15.2.3利用Clip属性创建多彩文字 285
15.2.4Clip属性值的进一步.考 287
15.2.5Dreamweaver设置Clip属性的小问题 287
15.3改变列表的样式 287
15.3.1列表标签介绍 287
15.3.2修改列表项的项目符号 289
15.3.3列表项添加分隔符 292
15.4实验:利用列表标签创建导航菜单 293
15.4.1面包屑路径 293
15.4.2将列表标签转化为行内元素 293
15.4.3目标导航条的外观 294
15.4.4目标导航条的要求 295
15.4.5代码实现I:加入链接与边框 295
15.4.6代码实现II:增加鼠标划过效果 297
15.5小结 298
第16章 CSS与JavaScript 299
16.1JavaScript简介 299
16.1.1JavaScript的分类 299
16.1.2一个简单的包含JavaScript的网页 300
16.1.3JavaScript的作用概述 301
16.2JavaScript范例 302
16.2.1利用JavaScript控制浏览器 302
16.2.2利用JavaScript实现事件处理 303
16.2.3JavaScript控制浏览器与网页行为 305
16.2.4利用JavaScript获得系统信息 307
16.2.5JavaScript通过Cookie记录用户状态 309
16.3利用JavaScript动态改变页面样式 313
16.3.1JavaScript间接修改样式 313
16.3.2JavaScript直接修改样式 315
16.3.3JavaScript动态修改样式小结 316
16.4使用JavaScript需要注意的一些问题 317
16.4.1开启浏览器的JavaScript功能 317
16.4.2JavaScript在网页中的位置 318
16.4.3在Dreamweaver中编辑JavaScript 318
16.4.4深入学习JavaScript的建议 320
16.5小结 321
第17章 项目学习:SmoothGallery相册剖析 322
17.1SmoothGallery简介 322
17.1.1SmoothGallery简介 322
17.1.2SmoothGallery下载与安装 323
17.1.3SmoothGallery效果演示 323
17.2剖析SG2.0的CSS样式 326
17.2.1演示页面的结构 326
17.2.2控制页面总体外观——layout.css 328
17.2.3控制相片的外观——jd.gallery.css 331
17.2.4SG2.0样式表剖析小结 337
17.3小结 338
第18章 未来的CSS 339
18.1现有CSS的不足 339
18.2CSS3介绍 341
18.2.1CSS3预览——渐变效果边框 342
18.2.2CSS3预览——圆角效果 343
18.2.3CSS3预览——多重背景 344
18.2.4CSS3预览——文本溢出处理 345
18.2.5CSS3预览——改变标签大小 348
18.2.6浏览器与ACID测试 349
18.2.7发展中的CSS3 352
18.3小结 352
附录A HTML4.0快速参考 353
附录B 字符实体表 368
附录C HTML颜色表 375
附录D CSS快速参考 377
附录E DOM快速参考 380