CSS3实用指南

CSS3为Web的视觉样式语言注入了强大的新功能，让设计人员更加轻松自如地设计优美而引人入胜的内容。借助CSS3，不使用图片就可以创建半透明背 景、渐变、阴影等夺人眼球的视觉效果；还可以使用漂亮、独特、非Web安全的字体显示文本；不用Flash就可以创建动画；不用JavaScript就可 以定制适应用户的设备和屏幕尺寸的设计。

本书通过一系列实用且新颖的范例，向读者展示如何实现以上功能和更多效果。每章都提供了几个实例，让你可以应用到正在开发的项目中，或从它们的设计思路中获取灵感。

本书还介绍了以下CSS3技术：

如何使用CSS3改善页面外观，提高可用性、可访问性和效率

处理不支持CSS3的早期浏览器的时机、解决方案和替代方案

如何利用独特的字体排版技术和漂亮的图片细节创建绝妙的设计

改进的新选择器，使标记更加流畅、不易出错

创建多列布局的新方法

如何...

(展开全部)

CSS3为Web的视觉样式语言注入了强大的新功能，让设计人员更加轻松自如地设计优美而引人入胜的内容。借助CSS3，不使用图片就可以创建半透明背 景、渐变、阴影等夺人眼球的视觉效果；还可以使用漂亮、独特、非Web安全的字体显示文本；不用Flash就可以创建动画；不用JavaScript就可 以定制适应用户的设备和屏幕尺寸的设计。

本书通过一系列实用且新颖的范例，向读者展示如何实现以上功能和更多效果。每章都提供了几个实例，让你可以应用到正在开发的项目中，或从它们的设计思路中获取灵感。

本书还介绍了以下CSS3技术：

如何使用CSS3改善页面外观，提高可用性、可访问性和效率

处理不支持CSS3的早期浏览器的时机、解决方案和替代方案

如何利用独特的字体排版技术和漂亮的图片细节创建绝妙的设计

改进的新选择器，使标记更加流畅、不易出错

创建多列布局的新方法

如何不用脚本也能轻松制作出针对手机优化的Web设计

目　　录
第1章　 CSS3的来龙去脉　　1
1.1 　什么是CSS3　　1
1.1.1 　新特性概览　　1
1.1.2　 CSS3的当前进展　　2
1.1.3　 现在就开始使用CSS3　　4
· · · · · · (更多)

目　　录
第1章　 CSS3的来龙去脉　　1
1.1 　什么是CSS3　　1
1.1.1 　新特性概览　　1
1.1.2　 CSS3的当前进展　　2
1.1.3　 现在就开始使用CSS3　　4
1.2　 浏览器的支持状况　　5
1.2.1　 浏览器市场份额　　5
1.2.2　 主流浏览器支持状况　　6
1.3　 渐进增强　　8
1.3.1　 优点　　9
1.3.2 “让我来打个比方……”　　10
1.4　 CSS3的好处　　11
1.4.1　 减少开发和维护的耗时　　11
1.4.2　 提升页面性能　　12
1.5　 更好的搜索引擎优化　　13
1.5.1　 提高可用性和可达性　　13
1.5.2　 与时俱进　　14
1.6　 案例学习：公路安全研究中心　　14
1.6.1　 使用CSS3之前　　14
1.6.2　 使用CSS3之后　　16
1.7　 明智地使用CSS3　　18
1.7.1 　浏览器前缀　　19
1.7.2　 处理不支持的浏览器　　22
1.7.3　 使用条件表达式过滤IE　　26
1.8　 搞定不予支持的客户或老板　　30
1.8.1 　有些事不必说　　30
1.8.2　 提前教给他们渐进增强的思想　　31
1.8.3　 控制客户因设计稿而生的过度期望　　31
第2章　 气泡对话框　　34
2.1　 基础页面　　34
2.2　 包裹长文本　　35
2.3　 无图的图形效果　　37
2.3.1 　圆角的实现　　37
2.3.2　 增加气泡的尾巴　　41
2.3.3　 利用RGBA或HSLA实现半透明背景　　47
2.3.4　 无图实现色彩渐变　　56
2.3.5　 无图实现盒状阴影　　63
2.3.6　 无图实现文字阴影　　67
2.4　 头像的变形效果　　70
2.4.1 　什么是“变形”　　70
2.4.2　 旋转头像图片　　72
2.5　 大功告成　　77
第3章　 纸质笔记　　79
3.1　 基础页面　　79
3.2　 高级背景图片技术　　80
3.2.1 　背景图片缩放　　80
3.2.2　 单一容器上的复合背景图片　　86
3.2.3　 添加图片边框　　91
3.2.4　 添加阴影　　100
3.3　 嵌入字体　　101
3.3.1 　@font-face是什么　　102
3.3.2　 选择可用字体　　103
3.3.3　 浏览器支持度　　108
3.3.4　 字体格式转换　　109
3.3.5　 使用@font-face　　110
3.4　 大功告成　　118
第4章　 根据类型为图片和链接定义样式　　121
4.1　 基础页面　　121
4.2　 什么是属性选择器　　122
4.3　 用动态添加的图标指示文件类型　　125
4.3.1 　除图标之外的备选方案　　127
4.3.2　 修正IE 6的问题　　128
4.4　 区别处理全幅图和缩略图的样式　　130
4.4.1 　使用类可能遇到的问题　　130
4.4.2　 使用属性选择器按类型定位元素　　132
4.5　 大功告成　　133
第5章　 使用伪类来提高效率　　135
5.1　 不使用ID和类来定位特定元素　　135
5.1.1 　新的结构伪类　　136
5.1.2　 回归气泡对话框：颜色交替　　137
5.1.3　 回归照片：随机旋转　　141
5.2　 动态高亮显示页面的区域　　147
5.2.1 　:target伪类　　147
5.2.2　 增加目录　　148
5.2.3　 更改聚焦区块的背景色　　153
5.2.4　 用纯CSS实现动画　　156
第6章　 不同的屏幕尺寸，不同的设计　　168
6.1　 基础页面　　168
6.2　 媒体查询是什么　　171
6.3　 针对宽屏来改变布局　　172
6.3.1 　由横向导航条变为纵向目录　　175
6.3.2　 多列文本　　176
6.4　 针对窄屏来改变布局　　181
6.5　 针对移动设备来改变布局　　187
6.5.1 　什么是设备宽度　　187
6.5.2　 第三次媒体查询　　188
6.5.3　 针对高清显示屏来改进界面　　194
6.5.4　 可视区域的meta标签　　195
6.6　 针对其他浏览器的兼容方案　　199
6.7　 大功告成　　200
第7章　 布局秀　　202
7.1　 重大改变　　202
7.2　 无需浮动或绝对定位，创建多列布局　　203
7.2.1 　子元素自适应　　205
7.2.2　 增加栏目　　210
7.2.3　 重定栏目顺序　　211
7.2.4　 多栏等高　　214
7.2.5　 水平和垂直居中　　216
7.3　 实际情况：现实可用部分　　221
7.3.1 　弹性表单布局　　222
7.3.2　 底部区域黏附　　225
7.4　 弹性布局模型的替代品　　230
7.4.1 　box-sizing属性　　230
7.4.2　 未来的布局系统　　235
附录　 浏览器支持度　　237
贡献　　 239
· · · · · · (收起)

CSS3是最新版的Web样式表语言，它不是介绍何创造新颖特效的，而更多地侧重于提供一些神奇的新方法来实现常见而优美的网页设计效果，这些新方法比十年来惯用的传统技术更为高效，而且能够获得可用性更高且灵活的结果。 CSS3在不断地变化和发展之中，因为支持CSS的浏览器在发展，网页设计师对它的认知程度也在不断提升。它可以用来创造一些令人惊艳的酷炫特效，本书将一一予以展现。要是..

• 引　　言
• 译者序