1、类名是可以重复的
要从整个页面考虑去分出一些公共类，就是说一个类名不要只针对一个标签。一个标签可以用空格隔开多个类。、
1） 不要去试图用一个类名，把某个标签的所有样式写完。这个标签要多携带几个类，共同造成这个标签的样式。
2） 每一个类要尽可能小，有“公共”的概念，能够让更多的标签使用。
2、后代选择器
他的存在就是为了共性和特性的平衡。他描述的是祖先结构，并不是机械的吧前面所有的祖先都要写上。只要能通过这个祖先结构找到他就可以了。
3、交集选择器
|
1 h3.special{ 2 color:red; 3 } |
选择的元素是同时满足两个条件：必须是h3标签，然后必须是special标签。交集选择器没有空格。
交集选择器可以连续交（一般不要这么写）因为IE6不兼容。交集选择器一般以标签开头。
|
1 h3.special.zhongyao{ 2 color:red; 3 } |
4、并集选择器
逗号表示并集。
5、通配符 *
6、儿子选择器
IE7开始兼容，IE6不兼容。
|
1 div>p{ 2 color:red; 3 } |
div的儿子p。和div的后代p的截然不同。
能够选择：
|
1 <div> 2 <p>我是div的儿子</p> 3 </div> |
不能选择：
|
1 <div> 2 <ul> 3 <li> 4 <p>我是div的重孙子</p> 5 </li> 6 </ul> 7 </div> |
7、序选择器
IE8开始兼容；IE6、7都不兼容
选择第1个li：
|
1 <style type="text/css"> 2 ul li:first-child{ 3 color:red; 4 } 5 </style> |
选择最后一个1i：
|
1 ul li:last-child{ 2 color:blue; 3 } |
由于浏览器的更新需要过程，所以现在如果公司还要求兼容IE6、7，那么就要自己写类名：
|
1 <ul> 2 <li class="first">项目</li> 3 <li>项目</li> 4 <li>项目</li> 5 <li>项目</li> 6 <li>项目</li> 7 <li>项目</li> 8 <li>项目</li> 9 <li>项目</li> 10 <li>项目</li> 11 <li class="last">项目</li> 12 </ul> |
用类选择器来选择第一个或者最后一个：
|
1 ul li.first{ 2 color:red; 3 } 4 5 ul li.last{ 6 color:blue; 7 } |
8、下一个兄弟选择器