css高效性

高效的CSS就是让浏览器在查找style匹配的元素的时候尽量进行少的查找。
1 不要在ID选择器前使用标签名
一般写法：DIV#divBox
更好写法：#divBox
解释： 因为ID选择器是唯一的，加上div反而增加不必要的匹配。
2 不要再class选择器前使用标签名
一般写法：span.red
更好写法：.red
解释：同第一条，但如果你定义了多个.red，而且在不同的元素下是样式不一样，则不能去掉，比如你css文件中定义如下：
p.red{color:red;}
span.red{color:#ff00ff}
如果是这样定义的就不要去掉，去掉后就会混淆，不过建议最好不要这样写
3 尽量少使用层级关系
一般写法：#divBox p .red{color:red;}
更好写法：.red{..}
4 使用class代替层级关系
一般写法：#divBox ul li a{display:block;}
更好写法：.block{display:block;}


IE在与FF负值的z-index的区别：
ie下给body元素默认了一个绝对定位属性（position: absolute）z-index其值无限小。
FF下body和html (被定义了样式属性时) 元素默认了一个绝对定位属性(position: absolute)不过他们的z-index是0。当body的z-index值为负的时候，body内的元素z-index值再大也不会冲破他的束缚，如果body外的元素（html）定义了样式属性时，body也不会冲破这个元素的束缚。

IE与Firefox对于当子块高度超过父块时的不同处理：
IE会自动扩大Content的高度，保持子元素margin-bottom的空间以及父元素自身的padding-bottom。
而Firefox会保证父元素的height高度，此时子元素将超过父块的范围。

IE与Firefox的边框与背景范围区别：
给元素设置background-color属性时，IE作用的区域为 Content+padding;而Firefox则是 Content+padding+border。


http://www.jb51.net/css/41452.html