css 书写规范

谨慎添加新的选择符规则，尤其不可滥用 id，尽可能继承和复用已有样式
选择符、属性、值均用小写（格式的颜色值除外），缩写的选择符名称须说明缩写前的全称，例如 .cl -> Clearfix
勿使用冗余低效的 CSS 写法，例如：ul li a span{... }
慎用 !important
建议使用具有语义化的 classname 或 id
避免使用兼容性不好的滤镜
开发过程中的未定事项，须用 [!] 标出，以便于后续讨论整理。
注释格式，统一使用双斜杠加*。
上下模块之间的间距统一使用下一个模块的 margin-top 来实现，好处是：如果没有下一个模块也不会多出一段空隙。
具有特定意义的请勿直接占用
```
hover，selected，disabled，current
```
不要使用 @import

避免使用各种 CSS Hack，如需对 IE 进行特殊定义

-  _          IE6
2. *          IE6/7
3. !important IE7/Firefox
4. *+         IE7
5. \9         IE6/7/8
6. \0         IE8
7. 条件hack
<!--[if lt IE 7]><html class="no-js lt-ie9 lt-ie8 lt-ie7"><![endif]--> IE7以下版本
<!--[if IE 7]><html class="no-js lt-ie9 lt-ie8"><![endif]--> IE7
<!--[if IE 8]> <html class="no-js lt-ie9"><![endif]--> IE8
<!--[if gt IE 8]><!--><html class="no-js"><!--<![endif]--> IE8以上

属性书写顺序,按照元素模型由外及内，由整体到细节书写，大致分为五组：

位置：position,left,right,float
盒模型属性：display,margin,padding,width,height
边框与背景：border,background
段落与文本：line-height,text-indent,font,color,text-decoration,...
其他属性：overflow,cursor,visibility,...

针对特殊浏览器的属性，应写在标准属性之前，例如：
```
-webkit-box-shadow:...;
-moz-box-shadow:...;
box-shaow:...;
```

a 链接样式顺序

书写顺序 L-V-H-A

:link :visited :hover :active

标签嵌套

内联元素却不能包含块元素，它只能包含其它的内联元素：

<div><h1></h1><p></p></div> —— 对

<a href=”#”><span></span></a> —— 对

<span><div></div></span> —— 错

h1、h2、h3、h4、h5、h6、p、dt只能包含内嵌元素，不能再包含块级元素

<p><ol><li></li></ol></p> —— 错

<p><div></div></p> —— 错

块级元素与块级元素并列、内嵌元素与内嵌元素并列：

<div><h2></h2><p></p></div> —— 对

<div><a href="#"></a><span></span></div> —— 对

<div><h2></h2><span></span></div> —— 错

如果嵌套 DIV,里面的比外面的大怎么解决?

外部 div 应该不设定 width 和 height,而是靠内部 div 大小撑开
若不得已，应该用overflow:hidden将内部 div 超出外部的部分隐藏掉
若想它可以滚动显示,可以改为overflow:scroll