CSS 3实战（全彩印刷）

为什么写这本书

CSS 3真可谓十年磨一剑，从10年前开始孕育，到今天逐渐引人瞩目，前端工作者们的确等待了太长的时间。
随着用户要求的不断提高、各种新型网络应用的不断出现，以及Web技术自身的高速发展，CSS 2在Web开发中显得越来越力不从心，人们对下一代CSS技术和标准——CSS 3的需求越来越迫切。坦率地讲，CSS 3的部分特性在几年前就已经公布，但是由于各种主流浏览器的“不作为”，特别是IE浏览器的“消极态度”，让很多前端工作者遗忘了CSS 3的存在。目前，CSS 3还在不断完善中，很多功能还处于草稿阶段，但是它展现出来的超强特性和功能已经让人兴奋不已。最近一两年，各种主流浏览器逐渐开始高调支持CSS 3的部分或者全部的功能特性，使得CSS 3又重新进入了广大前端工作者的视野。特别是IE 9对CSS 3的全面支持，更是将网页设计师带入了全新的天地。社区里各种关于CSS 3的讨论、资料和炫酷的应用开始爆炸式增长，广大前端工作者也开始蜂拥而至。
对于紧追前沿技术的前端工作者来说，充分了解当前和未来的Web标准和技术是十分必要的，学习和掌握CSS 3更是大势所趋。为了帮助大家在适应趋势和引领趋势的过程中能走得更顺利，受华章公司的盛情邀请，我特意编写了这本CSS 3实战教程，希望能起到抛砖引玉之效，为普及CSS 3尽绵薄之力。

本书面向的读者

首先，《CSS 3实战》非常适合具有丰富开发和设计经验的前端工作者，因为这部分读者应该已经对CSS 2了然于胸，通过本书，他们将能非常迅速而又有针对性地掌握CSS 3技术。
其次，本书也适合尚处于初级阶段的前端工作者，因为书中不仅系统而全面地介绍了CSS 3的各种功能和特性，而且还有大量实战案例和最佳实践，可供他们一边学习理论，一边进行实战演练。

本书内容特色

《CSS 3实战》是国内第一本系统、全面地讲解CSS 3的图书，它有两个重要的特色：
内容全面而详尽。本书几乎讲解了CSS 3已经公布的所有可用新特性和新功能的用法、技巧和注意事项。
案例丰富，实战性强。本书几乎为每个知识点都精心设计了1~2个实战案例，能帮助读者在实战演练的过程中将理论知识融会贯通。

本书约定

在《CSS 3实战》的阅读过程中，需要注意下面几个约定：
     初始值：即默认值，是当用户不显式声明时元素所显示的属性值。需指明的是，属性是元素的本质，而不是后天定义的标签。
     适用于：说明了该属性适用哪些元素，有些参考资料中所提供的适用元素列表很容易使读者陷于迷茫之中，指导意义不大，妨碍快速参考。
     继承性：这是CSS的基本特性，表明该属性值是否会对当前引用元素的内嵌子元素具有影响力。继承性对CSS布局而言具有重要的参考价值。
     百分比：表示该属性是否可以用百分比（%）或者em为单位，以及如果可以用百分比或者em为单位时，如何才能把这些值换算成确定的值。例如，百分比是根据自身的宽度进行换算还是根据父元素的宽度进行换算，再或者是根据元素内文本字体的大小进行换算等。默认值为N/A ，表示百分比不符合或者不可用。
     媒介：说明该属性适用于哪些设备，例如，visual表示视觉媒体，如电脑屏幕、WAP（如手机）屏幕、打印机等。
     在没有特别声明的情况下，本书所指的浏览器仅适用于Windows系统，不适用于Mac系统。
     Webkit引擎主要指苹果的Safari浏览器和谷歌的Chrome浏览器，其私有属性前缀为-webkit-。
     Gecko引擎主要指代Mozilla的浏览器，常指Firefox，其私有属性前缀为- moz。
     Presto引擎主要指代Opera浏览器，其私有属性前缀为-o-。
     《CSS 3实战》所有案例在Chrome 4.0+或者Safari 4.0+版本的浏览器中能够获得较好的表现。在IE 8及其以下的版本中，可能得不到预期的效果。
     为了方便阅读，本书中的部分示例代码仅提供了CSS样式代码和局部HTML结构代码，读者可以把这些CSS样式代码放在网页头部区域（即<head>标签内），局部HTML结构代码放在网页主体区域内（即<body>标签内）。
     《CSS 3实战》不是最终的CSS 3技术大全，CSS 3技术还在不断完善和补充中，所以也无法确保本书中讲解的所有知识将来都不会发生变化。建议读者根据本书所提供的参考地址，即时获取关于CSS 3的最新信息。

CSS 3技术学习延伸

学习CSS 3实际上并不难，难的是完全了解浏览器的兼容性问题。在还没有完全普及CSS 3标准之前，我们只能够根据各主流浏览器引擎所实现的CSS 3私有特性来实现兼容。这势必会导致将简单的问题复杂化，学习的成本和应用的难度也会相应增加。这一方面是因为很多CSS 3属性使用比较烦琐，如转换、过渡、渐变等，另一方面是因为设计时还要考虑各浏览器厂商的扩展（兼容方法）。对于广大前端工作者来说，下面这些参考资料也许会非常有用。
     CSS 3 Selectors Test：这是CSS 3.info网站提供的CSS选择器测试页面，它能够详细显示当前浏览器对所有CSS 3选择器的支持情况。启动测试，浏览器会自动测验，并以列表的方式显示当前浏览器对所有CSS 3选择器的支持情况，点击每个CSS 3选择器可以查看结果和解释信息。
     When can I use：这是一个专业的测试网站，为广大网页设计师提供CSS 3、HTML5、SVG、JavaScript API技术的浏览器支持情况检测，它能够准确显示什么时候能用CSS 3、HTML5、SVG，以及其他即将可用的页面技术的浏览器兼容性列表。
     What's my IP：这也是一个专业的小网站，可用于检测当前浏览器对CSS 3、HTML5、Forms 2.0、CSS 3选择器和Script等技术的支持情况。
     MooTools HTML5/CSS 3 feature detection：Modernizr是一个很有用的JavaScript库，可以检测HTML 5和CSS 3的原生支持，并提供一种维护良好控制级别的方法。如果你喜欢使用MooTools，可以使用MooModernizr（MooTools 版本的Modernizr）。
     CSS 3 Generator：这是一个CSS生成器，可以快速地以可视化的方式生成CSS 3新特性的样式，不过该工具仅支持border radius、box shadow、text shadow、RGBA、@font-face、多列、box resize、box sizing 和outline特性，其他特性暂不支持。
     CSS 3 please!：这是跨浏览器的CSS规则生成器，支持border-radius、box-shadow、渐变（线性）、rgba色彩、transform （旋转）、transition和@font-face。
     CSS 3 Sandbox：提供了几个CSS 3生成器，包括线性渐变、放射渐变、文字阴影、盒阴影、Transforms和文字描边。
     CSS 3渐变生成器：为Firefox和Webkit浏览器生成线性渐变。
     @font-face 生成器：来自于Font Squirrel的很好用的CSS 3 @font-face生成器。
     CSS 圆角生成器：生成用于Firefox、Webkit和标准CSS 3语法的border-radius属性。
     CSS 3.0 参考手册：这是由腾讯ISD WebTeam制作的一个CHM文档，由于时间较早，稍显陈旧，错误和遗漏比较多，不过对想了解CSS 3基本特性的初学者来说，还是有一定的参考价值。

致谢

《CSS 3实战》主要由成林编写，同时参与资料整理及编写的还有：马本连、吴建华、江淑军、李斌、李经键、郑伟、田蜜、陆颖、王慧明、张炜、陈锐、王幼平、杨龙贵、苏震巍、崔鹏飞等，在此对大家的辛勤工作表示衷心的感谢！
由于时间有限，书中难免会有疏漏和不足之处，恳请广大读者提出宝贵意见。有关本书的任何问题，请发电子邮件到css3shizhan@163.com。

作者　　
2011年3月于北京　　

《CSS 3实战》
国内首本CSS 3专著，全面而深入讲解CSS 3的最新特性和布局之道
实战性强，全书囊括近百个精心设计的实战案例，理论与实践完美结合
资深Web前端工程师多年实践经验的结晶，3大社区联袂推荐
【互动网购买】【当当网购买】【卓越网购买】【豆瓣讨论】