用过css的同志们都知道，选择器是非常重要的，如果选择器使用不当，即使你的css写的再好，但是不知道要用在哪个元素上，这不是英雄无用武之地吗？
css，用过的都说好！
最基本的选择器，id选择器，类选择器这些大家早已心知肚明的就不在这里赘述了，有那功夫赶紧研究一下把妹攻略.
伪类：
:link，:visited被称为链接伪类，只能被用在<a>标签上。:hover，:active，:focus称为动态伪类，可以用于任何元素。
属性选择器：
支持自定义属性
input[title=te]{color:red} /*属性选择器*/
input[other=wch]{color:blue}
层叠和特殊性
顺序：!important的用户样式 > !important的作者样式 > 作者样式 > 用户样式 > 继承 > 浏览器样式
css特殊性计算规则：
css特殊性分成4个等级；a,b,c,d
a表示 style样式；
b表示id选择器的数量；
c表示类、伪类和属性选择器的数量；
d表示类型选择器和伪元素选择器的数量。
由此计算出来的四位数abcd，值越大，优先级越高；
例如：
style=""
值为1000
值为1000
#wrapper #content {}
值为0200
值为0200
div#content{}
值为0101
值为0101
#conten{}
值为0100
值为0100
p.comment .dateposted{} 值0021
div p{} 值为0002
如果两个规则的特殊性相同，那么后定义的规则优先。
演示代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
<style >
a:hover,input:hover{border-color:red;} /*伪类选择器*/
a:focus,input:focus{border-color:blue}
a:active,input:active{border-color:green}
a:link{border-color:#FFFF00}
a:visited{border-color:#FF33CC}
a + p{color:green} /*选择兄弟元素，无效好像*/
#nav>li{color:red !important;} /*改变特殊级别*/
#nav li{color:yellow}
#nav li *{color:green} /*通用选择器*/
input[title=te]{color:red} /*属性选择器*/
input[other=wch]{color:blue}
div#ttt{color:#CC0066}
</style>
</head> <body>
<a href="#" >wch</a>
<input type="text" value="12321" title="test" other="wch" />
<input type="text" value="12321" title="te" other="qqq" />
<input type="text" id="ttt" value="wch" />
<div id="ttt">test element#id</div>
<ul id="nav">
<li>h1</li>
<li>
<ul>123312
<li>x1</li>
<li>x2</li>
</ul>
</li>
<li>h3</li>
</ul>
</body>
</html>