#第一章 揭开CSS3的面纱
> 如果关注前端方面的技术，那么对CSS一定不会陌生，你肯定听说过CSS3。在使用CSS3之前，应该对这个新一代语言样式表语言的来龙去脉有个基本了解。
##1.1 什么是CSS3
CSS3并不是一门新的语言。如果接触过CSS就知道，CSS是创建网页的另一个独立但并非不重要的一部分。CSS是种层叠样式表，是一种样式语言，用来告诉浏览器如何渲染你的web页面。
> **CSS3是CSS规范的最新版本**
###1.1.1 CSS3的新特性
> CSS3新特性非常多，这里挑选一些被浏览器支持较为完美、更具实用性的新特性。
1. 强大的CSS3选择器
2. 抛弃图片的视觉效果
3. 背景的变革
4. 盒模型变化
5. 阴影效果
6. 多列布局与弹性盒模型布局
7. Web字体和Web Font图标
8. 颜色和透明度
9. 圆角与边框的新法
10. 盒容器的变形
11. CSS3过渡与动画交互效果
12. 媒体特性与`Responsive`布局
###1.1.2 CSS3的发展状况
CSS3的每一个模块都有它自己的更新（进度表）时间。有兴趣的可以到[这里-（点我查看进度）](https://www.w3.org/Style/CSS/current-work.en.html)查看到CSS3当前发展的详细进度。
###1.1.3 现在能使用CSS3吗？
CSS3还在不断完善中，很多功能还处于草稿阶段，但部分模块进入了"候选推荐"状态，说明在Web设计中完全可以使用这些模块。我一般都是通过[can i use](http://caniuse.com/)查看一个属性的浏览器支持情况的。
###1.1.4 使用CSS3有什么好处
与CSS比起来，使用CSS3有什么好处呢？最明显的就是CSS3能让页面看起来非常炫、非常酷，使网站设计锦上添花，但是它的好处远远不止这些。在大多数情况下， 使用CSS3不仅有利于开发与维护，还能提高网站的性能。与此同时，还能增加网站的可访问性、可用性，使网站能适配更多的设备，甚至还可以优化网站SEO，提高网站的搜索排名结果。**下面介绍CSS3特有的好处。**
1. 减少开发与维护成本
2. 提高页面性能
##1.2 浏览器对CSS3的支持情况
想知道用户能够体验到那些CSS3的新特性，必须了解当前浏览器对CSS3特性的支持程度如何。我一般都是通过[can i use](http://caniuse.com/)查看一个属性的浏览器支持情况的。
###1.2.1 经典回顾：图说浏览器大战
略
###1.2.2 浏览器的市场份额
- 浏览器国内市场份额
**2016-1 到 2016-11 百度统计结果 [查看最新份额](http://tongji.baidu.com/data/browser)**
- 浏览器全球市场份额（略）
###1.2.3 主流浏览器对CSS3支持情况
幸运的是，CSS3特性大部分都已经有了很好的浏览器支持度。各大主流浏览器对CSS3的支持越来越完善，曾经让多少前端开发人员心碎的IE也开始挺近CSS3标准行列。当然，即使CSS3标准制定完成，现代浏览器要普及到大部分用户也是一个相当漫长的过程。如果现在就要使用CSS3来美化你的站点，有必要对各大主流浏览器对其新技术的支持情况有一个全面的了解。
1. 主流浏览器对CSS3属性的支持情况（下图数据来源[findmebyIP](http://fmbip.com/litmus)）
2. 主流浏览器对CSS3选择器的支持情况（下图数据来源[findmebyIP](http://fmbip.com/litmus)）
##1.3 渐进增强
> 渐进增强并不是一种技术，而是一种开发的方式，更是一种web设计理念。首先思考一个问题：“网站是否需要在每个浏览器中看起来都一样？” 带着这个问题来看渐进增强。
###1.3.1 渐进增强与优雅降级
正如前面所言，渐进增强并不是一种技术，而是一种开发的方式，更是一种web设计理念。在编写web页面时，首先保证最核心的功能实现，让任何低端的浏览器都能看到站点内容，然后考虑使用高级但非必要的CSS和JavaScript等增强功能，为当前和未来的浏览器提供更好的支持，给用户带来更好的体验。
在设计的时候，先考虑低端设备用户是否能够看到所有的内容，然后在此基础之上为高端用户进行设计。不仅为高端设备用户提供一个完美的应用，也要为不同性能级别设备的用户设计不同级别的不那么完美的应用。这成为**“优雅降级”**。
###1.3.2 渐进增强的优点
> 向尽可能多的用户提供尽可能优质的用户体验
CSS的渐进增强有别于CSS的hack。hack是浏览器厂商的一种手法，用来增强自己的竞争，而渐进增强起到锦上添花之效。所以前者应该尽量避免使用，而后者应该适当使用。
##1.4 CSS3的现状及未来
###1.4.1 谁在使用CSS3
国内外使用CSS3特性制作网站的案例越来越多，特别是一些优秀的个人站点，更是运用得出神入化。
###1.4.2 CSS3的未来
CSS3无疑对web前端开发带来质的飞跃。虽然目前CSS3还没有完全普及，而且浏览器也不完全支持，但对于我们积极地去学习和实践并不矛盾，掌握和学习CSS3将是大势所趋。CSS3将是引导我们进入编写网页精彩世界的先驱技术。开发人员能够更轻松地创建功能强大、易于维护网站。
随着旧版浏览器所占市场份额逐渐减少，学习CSS3技术将更有价值。这是作为一个优秀前端开发人员所必须掌握的技术之一，也是前端开发人员的大势所趋。
当然，学习一门新技术不能跟风，需要理性思考，这种理性思考并不表示对新技术的畏缩，同时也应该明白学习新技术可能会遇到的困难和风险。只有这样，才能更好的驾驭CSS3。
##1.5 本章小结
本章主要介绍了什么是CSS3、CSS3的发展状况、新特性，以及浏览器对CSS3的支持情况；同时，引进了渐进增强的设计理念。通过本章的学习，可以对CSS3有一个初步的了解。学习CSS3的好处有很多，它能让你始终处于web设计的前沿，增加你的职业技能和竞争力，还能帮助你缩短与顶级设计师或开发者的距离。
