由布局学习CSS——w3c文档复习
（1）浏览器间内核的差异是产生兼容性问题的根本原因。
（2）工作模式：工作模式起源于IE6，IE6的发布增强了对CSS1的兼容，这使得IE6对CSS的渲染和它前面的版本有了很大的不同，例如在盒子模型的理解上。为了保持良好的兼容性，IE为开发者提供了一个开关，来决定浏览器的工作模式。工作模式最初分为两种：（a）标准模式（b）怪异模式。IE 系列的“混杂模式”，将浏览器的行为冻结在了 IE5.5 这个版本，虽然 IE 各版本的混杂模式也略有区别，但它们的本意都是向后兼容。
（3）CSS特性的值：长度值表示为 <length>。长度值的格式是： <number> + 单位( e.g., px, em, etc.)，注意，一定要有单位，除非这个值是0。 如果长度值是0，单位可有可无。
十六进制的 RGB 颜色值必须含有 “#” 前缀，后跟三个或六个十六进制字符。 其中，三位的和六位之间的转换是：'#rgb' 等于 '#rrggbb'，所以，'#FFFFFF' 可以简写成 '#FFF'。
函数记号的 RGB 颜色值，rgb(……)，括号里面是三个逗号分隔的 0～255 的值，或者是三个百分比值。百分比值 p 和整数值 v 的关系是 v=255×p。
CSS Hack：主要的应用有_property,*property,propety:value\9。应用举例：在消除IE6,7,8（Q）的行内元素浮动在某些情况下发生折行的bug时用到*margin-top：-20px;
(4)CSS值的解析：当浏览器解析了一个文档 ( document ) 并且生成了文档树 ( document tree )，那么，它必须为文档树中的每一个元素，根据目标媒介类型所适用的每一个特性，指定一个值。
开发者给某个元素的 CSS 特性设置某个值，到这个元素的特性值被计算渲染，也就是得到最终的值，需要经过四步计算：
- 通过指定值 ( specified value ) 确定这个值；
- 将这个值分解为一个可以用来继承的值，即计算后的值 ( computed value )；
- 必要情况下把计算后的值转换成一个绝对的值，即使用值 ( used value )
- 根据显示环境的限制，改变使用值以使之能够显示在用户端，最后这个值被称作实际值 ( actual value )。
指定值的确定：首先考虑有层叠顺序的情况，即开发者明确了设置了 CSS 特性的值。如果没有明确的设置这个值，那么会先考虑它是否继承了父元素的值。这时候指定值使用它父元素的值，通常是父元素的计算值。最后，在不存在以上两种情况的时候，使用元素的初始值。
（5）CSS层叠：CSS 是 Cascading Style Sheets 的缩写，即层叠样式表。 之所以叫做层叠样式表，是因为样式表有三种来源：作者，用户和客户端。这三种样式表中可能会出现层叠。既然有重叠那么究竟选哪一个样式就是需要我们考虑的。在W3c中给的官方解释中，一个是优先级算法和specific算法。优先级算法，从某种角度来说是决定采用作者，用户还是客户端，具体算法如下：
根据 CSS 样式的来源和重要性(是否含 !important )，给出了优先级的升序排列：
- 用户端声明( UA declarations )
- 一般用户声明( user normal declarations )
- 一般作者声明( author normal declarations )
- 加了 '!important' 的作者声明( author important declarations )
- 加了 '!important' 的用户声明( user important declarations )
拥有相同重要性和来源的规则，按照 CSS specificity 来排序。
特殊性的值可以看作是一个由四个数组成的一个组合，用 a，b，c，d 来表示它的四个位置。
依次比较 a，b，c，d 这个四个数比较其特殊性的大小。比如，a 值相同，那么 b 值大的组合特殊性会较大，以此类推。
a，b，c，d 值的确定规则：
①如果HTML标签的’style’属性中该样式存在，则记a为1
②数一下选择器中ID选择器的个数作为b的值
③其他属性以及伪类的总数量是c的值
④元素名和伪元素的数量是d的值。
但是在实际是在chrome，IE8,9中first-line的优先级更高，只要有伪元素，那么这个选择器对应特殊性最高。如果是伪类，那么就刚好符合对应的算法。
（6）CSS框模型：为了给文档树中的各个元素排版定位（布局），浏览器会根据渲染模型为每个元素生成四个嵌套的矩形框， 分别称作 content box、padding box、border box 和 margin box，它们是不可分割的，并可能会重合， 这就是 CSS 规范中描述的“框模型”（box model）。
（7）CSS框模型——margin——外边距折叠：指的是毗邻的两个或多个外边距 (margin) 会合并成一个外边距。http://www.w3help.org/zh-cn/kb/006/
（8）CSS定位体系：常规流，浮动，绝对定位。 "position:absolute" 和 "position:fixed" 优先级最高，有它存在的时候，浮动不起作用，'display' 的值也需要调整； 其次，元素的 'float' 特性的值不是 "none" 的时候或者它是根元素的时候，调整 'display' 的值； 最后，非根元素，并且非浮动元素，并且非绝对定位的元素，'display' 特性值同设置值。
