CSS3实用指南

目录

第1章　 CSS3的来龙去脉1

1.1 　什么是CSS31

1.1.1 　新特性概览1

1.1.2　 CSS3的当前进展2

目录

第1章　 CSS3的来龙去脉1

1.1 　什么是CSS31

1.1.1 　新特性概览1

1.1.2　 CSS3的当前进展2

1.1.3　 现在就开始使用CSS34

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　 明智地使用CSS318

1.7.1 　浏览器前缀19

1.7.2　 处理不支持的浏览器22

1.7.3　 使用条件表达式过滤IE26

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-face110

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

译　者　序 本书原名为Stunning CSS3，起初我们将其直译为《惊艳的CSS3》，因为你可以在书中的一些角落找到能够与之呼应的“令人惊艳”一词。现名《CSS3实用指南》则显得朴素而直接，事实上也更能阐述本书的主旨：除了令大家“一眼惊艳”之外，更重要的还是通过真实的项目实操来全面了解CSS3技术。其中最具实用意义的浏览器兼容方案的内容则更是能够帮助你马上将这些新技术运用到实际项目之中——毕竟...

(查看全部试读)