怪异模式和DTD
为确保向后兼容，浏览器厂商发明了标准模式和 怪异模式 这两种方式来解析 网页。
在标准模式中，浏览器根据规范 表现页面；而怪异模式通常模拟老的式浏览器（比如IE４ ）的行为以防止老站点无法工作。
这两种模式的差异比较大，比较典型的就是IE对盒模型的解析：
在标准模式中，网页元素的宽度是由padding,border,width三者的宽度相加决定的；而在怪异模式，width本身包括了padding和border的宽度。
此外，标准模式下块级元素的经典居中方法：设定width，然后margin-left:auto;margin-right:right;在怪异模式下是无法正常工作的。
同样的代码 在怪异模式和标准模式下的表现很可能相差甚远。因为发现怪异模式 的目的就是 为了兼容老式的 浏览器下的代码，它的很多解析方式是不符合标准的，所以，一般情况下，我们应该避免触发怪异模式，应选用 标准模式。
怪异模式的触发与 DTD有关。
HTML文件开始声明文件的DTD类型。如漏写DTD声明，Firefox仍然会按照标准模式来解析 网页，但在IE中（包括IE 6 7 8）就会触发 怪异模式。在css布局时代，DTD的声明非常重 要，为避免怪异模式给我们 带来不必要的麻烦，要记得DTD声明。
模块化CSS
margin是个特殊的样式，
相邻的margin-left和margin-right是不会重合的，但相邻的margin-top和margin-bottom会产生重合，
所以margin-top和margin-bottom最好不要重合使用。
当不同的选择符的样式设置有冲突时，会采用权重高的选择符设置的样式。
权重的规则：
HTML标签的权重是1，class的权重是10， id的权重是100，
例如p的权重是1，'"div em"的权重是1+1=2；“strong.demo”的权重是10+1=11 ....
如果CSS选择符权限相同，那么样式会遵循就近原则，哪个选择符最后定义，就采用哪个选择符的样式。
id与class的区别
同一个网页，相同的id只能出现一次，它不可重复，而class可以任意出现多次，
id的权重是100，class的权重是10
CSS hack
IE条件注释法：
只在IE下生效
<!--[if IE]>
<link type="text/css" href="" >
<![endif]-->
只在IE6下生效
<!--[if IE 6]>
<link type="text/css" href="" >
<![endif]-->
如果我们想针对某个范围以内的IE版本进行hack，可以结合lte, lt, gte, gt, !关键字来注释
其中lte 表示 小于等于，lt 表示 小于， gte 表示 大于等于；
if gt IE 6
if ! IE 7 只在ie7上不生效。
选择符前缀法：
例如*html 只对IE6生效，
*+html前缀只对IE7生效。
但不能保证以后的 IE9 10 不识别。。有风险
.test{ } /*ie 6 7 8*/
*html .test{ } /*ie 6*/
*+html .test{ } /*ie 7*/
样式属性前缀法： （还可以用于内联样式）
_ 只在ie6生效，
*在ie6 7 下生效
样式属性前缀法 比起选择符前缀法 聚合程度 更高，代码更精简，可维护性更强，但和选择符前缀法一样，它在向后 兼容性上 存在 一点风险
hasLayout
触发方法：设置width height,position为relative等
水平居中：
文本、图片等行内元素的水平居中 text-align:center
确定宽度的块状元素的水平居中 margin-left:auto;margin-right:auto;
不确定宽度的块状元素的水平居中
