1.元素选择器（类型选择器）

html {color:black;}

2.选择器分组

h2, p {color:gray;}

3.CSS 类选择器

.important {color:red;}

4. ID 选择器

#intro {font-weight:bold;}

5.属性选择器

简单属性选择

img[CBD] //有CBD属性的img元素
a[href][title] //同时有 href 和 title 属性

具体属性选择

a[href="http://www.w3school.com.cn/about_us.asp"]

部分属性值选择

p[class~="important"] {color: red;} //包含class为important的元素

子串匹配属性选择器

[abc^="def"] //选择 abc 属性值以 "def" 开头的所有元素
[abc$="def"] //选择 abc 属性值以 "def" 结尾的所有元素
[abc*="def"] //选择 abc 属性值中包含子串 "def" 的所有元素

特定属性选择类型

*[lang|="en"]

6.后代选择器

h1 em {color:red;}
a#b .cls { width: 100px;}

<a id=b>
   <span>1<span>
   <span class=cls>2<span>
</a>
<span class=cls>3<span>

7.CSS 子元素选择器

h1 > strong {color:red;}

8.CSS 相邻兄弟选择器

h1 + p {margin-top:50px;}

9.CSS 伪类

a:hover {color: #FF00FF}

10.CSS 伪元素

h1:before { content:url(logo.gif); }