css3 层叠样式表

css3 较之css2.1增加很多新的api，也成为浏览器的标准。

简单记下选择器的种类和类型，具体可查阅MDN 官方文档

1，伪类选择器伪类

     :target 伪类用来指定那些包含片段标识符的            URI 的目标元素样式。

2，元素选择器（最常见最基本的）

span {background-color:DodgerBlue;color:#ffffff;}

3，类选择器

span.classy{background-color:DodgerBlue;}

4，ID选择器

span#identified{background-color:DodgerBlue;}

5，通配选择器

在CSS中,一个星号(*)就是一个通配选择器

ns|* - 会匹配ns命名空间下的所有元素

*|* - 会匹配所有命名空间下的所有元素

|* - 会匹配所有没有命名空间的元素

6，属性选择器

[attr]

表示带有以 attr 命名的属性的元素。

[attr=value]

表示带有以 attr 命名的，且值为"value"的属性的元素。

[attr~=value]

表示带有以 attr 命名的属性的元素，并且该属性是一个以空格作为分隔的值列表，其中至少一个值为"value"。

[attr|=value]

表示带有以 attr 命名的属性的元素，属性值为“value”或是以“value-”为前缀（"-"为连字符，Unicode编码为U+002D）开头。典型的应用场景是用来来匹配语言简写代码（如zh-CN，zh-TW可以用zh作为value）。

[attr^=value]

表示带有以 attr 命名的，且值是以"value"开头的属性的元素。

[attr$=value]

表示带有以 attr 命名的，且值是以"value"结尾的属性的元素。

[attr*=value]

表示带有以 attr 命名的，且值包含有"value"的属性的元素。

[attroperatorvaluei]

在带有属性值的属性选型选择器表达式的右括号（]括号）前添加用空格间隔开的字母i（或I）可以忽略属性值的大小写（ASCII字符范围内的字母）

7，相邻兄弟选择器

li + li {color:red;}

8，通用兄弟选择器

在使用 ~ 连接两个元素时,它会匹配第二个元素,条件是它必须跟(不一定是紧跟)在第一个元素之后,且他们都有一个共同的父元素 .

p ~ span {color:red;}

9，子选择器

元素1 > 元素2 {样式声明 }

10，后代选择器

元素1 元素2 {样式声明 }