众所周知，css的运行环境就是浏览器，所以我们要先认识浏览器。1.浏览器如何工作？有一篇文章叫做《浏览器的工作原理：新式网络浏览器幕后揭秘》，简单介绍了浏览器的工作过程。让我们先谈谈CSS。上图是webkit内核渲染html和css的流程图。从图中可以看出，html的解析是一条线，css的解析是一条线。两者会在某一点结合起来，形成最终的观点。如果我们专注于CSS，从上图我们可以总结出学习CSS的三个突破点。浏览器如何加载和解析CSS——CSS的5个来源；CSS和HTML是如何组合的——选择器；CSS可以控制哪些显示方式——方框模式、浮动、定位、背景、字体等；本系列文章也是按照这样的思路和框架，一步步展开的。2.css的加载过程css（CascadingStyleSheets）就是层叠样式表。“样式表”大家比较好理解，那么什么是“层叠”呢？从字面上看，级联肯定需要多层叠加。而这个“多层CSS”到底有多少层，每一层是什么，我们程序员会用到哪几层呢？这些问题将是我们讨论的重点。另外，层层叠加，如何处理冲突，以哪一层为准？这也是我们讨论的重点。最后，在这些层中还有一个“浏览器默认样式”层，即浏览器对每个html元素的默认样式。这一次，我们就来跟浏览器这个“机器人”学学，看看它写的CSS对我们有什么帮助。3、css与html的结合CSS如何与html结合——当然是通过选择器。CSS提供了多种选择器类型，每一层级都在不断增加新的选择器类型，使选择器更加灵活易用。本系列会拿出一篇专门讲解选择器的文章。聪明的人类还通过jquery、zen-coding等css提供的选择器，在其他相邻方面拓展自己的领地。对于CSS选择器，有一个很重要的话题——层次。在大多数web前端面试题中，你会看到css选择器级别的判断题。《css设计指南》书上给出了概念具体度，并给出了计算公式和计算规则，还给出了简单的背诵公式。真周到。最后，伪类和伪元素与选择器密切相关。我们还会出一篇文章专门讲解伪类和伪元素，以及它们最典型的用法。4.页面渲染页面渲染可以分为两类——文本和块。对于文本，我们可以设置字体、字号、粗体、斜体、背景颜色等；对于块来说，有更多的情况，比如盒模型、浮动、定位、展示、背景等等；本系列会拿出很多篇幅来讲解基础知识，以及它们的一些关键应用。5.布局布局是css的重头戏，各个系统的布局都有自己的特点。没有好坏之分，各有优缺点，不妨举几个典型的例子一起分析。例如：经典的三栏布局Bootstrap网格布局百度首页布局微博布局人人网布局瀑布流布局...
