CSS选择器（感觉挺有用的）

1、关系选择器

E > F：子选择器，该选择器定位元素E的直接子元素中的所有元素F，它将忽略任何进一步的嵌套 :

ul > li {list-style:none;} //仅限ul的直接子元素li，如果li里面还嵌套着另一个 ul 结构时，最里面的 li 将被忽略；

E + F：相邻兄弟选择器，该选择器定位与元素E具有相同父元素且在标记中紧邻E的元素F :

li + li {border-top:1px solid #ddd;} //定位具有相同父元素ul里除第一个li之外的所有li（感觉这个很有用）；

E ~ F：一般兄弟选择器，该选择器定位与元素E具有相同父元素且在标记中位于E之后的所有元素F：

h1 ~ p {color:#f00;} //定位具有相同父元素的，h1标签之后的所有p标签

2、属性选择器

E[attr=val]：该选择器定位具有属性attr且属性值为val的任何元素E:

input[type=password] {border:1px solid #aaa;} //定位页面里的密码输入框

E[attr

=avl]：该选择器定位具有属性attr且属性值为val或以val-开始的任何元素E;

E[attr~=val]：该选择器定位具有属性attr且属性值为完整单词 val 的任何元素E;

E[attr^=val]：该选择器定位具有属性attr且属性值以val开头的任何元素E;

E[attr$=val]：该选择器与E[attr^=val]正好相反，定位具有属性attr且属性值以val结尾的任何元素E;

E[attr*=val]：该选择器与E[attr~=val]相似，但更进一步，定位具有属性attr且属性值任意位置包含val的元素E，val可以是一个完整的单词，也可以是一个单词中的一部分;

3、伪元素

::selection：匹配突出显示的文本：

::selection {background:#444; color:#fff;} //定义选中的文本颜色与背景色。

参考文献：CSS选择器详解

CSS Hack

• HACK规则：

  　 　IE都能识别 * ，标准浏览器(如FF)不能识别 * ；
  　 　IE6能识别 * ，但不能识别 !important ;
  　 　IE7能识别 * ，也能识别 !important ;
  　 　FF不能识别 * ，但能识别 !important ;

• IE8/IE9的CSS Hack：

  　 　“\9″ 只在IE6/IE7/IE8/IE9/IE10下生效 ；
  　 　“\0” 只在 IE8/IE9/IE10下生效 ;
  　 　“\9\0”只在IE9/IE10下生效;

• 仅IE7识别：

  　 　* +html {…}
  　 　* +html #wrapper { width: 60px;} /* ie7 fixed, 注意顺序 */

• 仅IE6识别：

  　 　_class {…}

• IE6及IE6以下识别：

  　 　* html {…}
  　 　这个地方要特别注意很多博客都写成了是IE6的HACK其实IE5.x同样可以识别这个HACK。其它浏览器不识别。

• 仅IE6不识别，屏蔽IE6：

  　 　select { display /屏蔽IE6/:none;}
  　 　这里主要是通过CSS注释分开一个属性与值，注释在冒号前。;

万能 float 闭合

关于 clear float 的原理可参见 How To Clear Floats Without Structural Markup
将以下代码加入Global CSS 中,给需要闭合的div加上 class=”clearfix” 即可.

.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
} 
.clearfix { 
    *zoom:1;
} 

一直认为zoom是很特别的，值得好好的研究一番，

后记

除了以上提到的还有很多很多的CSS Hack 技巧，例如高度自适应，margin，padding 等等。不过本人认为ie6、7已然被淘汰了，毕竟我们是往前看的，是追逐潮流的，更何况现在的浏览器那么多，还多半是双核的（搜狗、猎豹、360等）（怎么看都有一种是要把ie过渡掉的节奏），手机用的浏览器都没几个是ie内核的了，说不准准哪天ie就不在了，这里总结css hack技巧现感觉上也只是用来怀念一下，所以有什么出入也请大神们多多见谅。