简介
本文主要介绍元素选择器，id选择器，class选择器，派生选择器和属性选择器这五种情况。
元素选择器
CSS中直接指定元素的样式。
CSS
h1{...}
h2{...}
p{...}
可以使用通配选择器*{…}，它会作为没有特别指定的元素的默认样式。
id选择器
html中指定元素id为xxx，CSS中使用#xxx{…}设置样式。
html
<p id="red">这个段落是红色。</p>
CSS
#red {color:red;}
值得注意的是，每个id 属性只能在一个 HTML 文档中出现一次。即一个id只能给一个标签使用，不能同时赋给多个标签。
class选择器
html中指定元素class为xxx，CSS中使用 .xxx{…}设置样式。
html
<div class="divclass"></div>
CSS
.divclass {
color: #f60;
background: #567;
}
结合元素选择器 ：可以使用 a.xxx{…}指定只适用于a元素的class选择器。
多类选择器 ：在html指定class=”a b”,a和b用空格隔开，它会同时继承a和b的样式。在此基础上，还可以在CSS中使用.a.b{…}使得同时继承a和b样式的元素还拥有自己特殊的样式。
NOTICE
因为id在页面只能使用一次，所以提倡少用id，否则可能和页面嵌的程序冲突（比如名称相同等）。
class名字不要使用数字开头。
建议单一使用的样式和需要程序、js动态控制的样式用id。
建议重复使用的元素、类别，用class。
派生选择器
又叫做上下文选择器，根据上下文关系来定义样式。它可以与id选择器和class选择器组合使用。在CSS中使用空格分隔名称。
html
<p class="pclass">显示段落默认的蓝色<a href="...">显示派生选择器指定的红色</a></p>
<a class="aclass" href="...">显示链接默认的绿色</a>
CSS
.pclass{color:blue}
.pclass a{color:red}
.aclass{color:green}
属性选择器
在html中指定属性的样式。
<head>
<style type="text/css" >
[title]{ color:blue }
[title=override]{color:red}
</style>
</head>
<body>
<p title="default">使用属性选择器指定的蓝色</p>
<p title="override">使用了选择器指名的名称，优先显示红色</p>
</body>
最后附上GitHub：<https://github.com/gonearewe>
