CSS常用选择器

1 通配选择器（*）

  通配选择器可以与任何元素匹配

     例：设置文档中每一个元素都为红色

             * { color : red  } 

2 类选择器 （class）

   <h1 class="warning">Plutonium</h1>

3 ID选择器（id="most"）

4 属性选择器

（1） 根据具体属性值选择：

<h1 class="warning">Plutonium</h1>

例：选择有class属性（值不限）的所有h1元素。文本为银色。

h1[class] { color : silver }

（2）根据部分属性选择：

<p class="warning urgent">When handling plutonium, care must be taken to auoid the formation of a critical mass.</p>

例：选择class属性中包含warning 的元素。

p[class~="warning"] { font-weight :bold}

 (2-1) 子串匹配属性选择器

类型                             描述

[foo^="bar"]                  选择foo属性值以" bar "开头的所有元素

[foo$="bar"]                  选择foo属性值以 " bar " 结尾的所有元素

[foo*="bar"]                   选择foo属性值中包含子串" bar  " 的所有元素  

5 后代选择器

“...........作为........的一部分”  或 “......作为.....的后代”

例 ：

       “ li ”  作为  “ ul ”  的一部分

6 选择子元素

 

<h1> This is <strong>very</strong> improtant </h1>

h1>strong { color : red  }

7 相邻兄弟选择器

li + li { margin -left : 20px }

8 伪类选择器

a：visited   指示作为已访问地址超链接的所有锚

a: link         未访问地址的所有锚

:foucs         输入框焦点元素

:hover         鼠标指针停留在元素上

:active        用户输入激活的元素

9 伪元素选择器

:nth-first-child

:first-letter / :first-line

等