CSS中的选择器

CSS选择器包括4大类： 标签选择器、id选择器、class选择器、特殊选择器；
常用的选择器有十种左右：

标签选择器
类选择器
ID选择器
伪类选择器
群组选择器（集合选择器）
通配符（*）
包含选择器（后代选择器）
伪元素选择器
属性选择器
1、标签选择器：

类型选择符是根据html语言中的标记来直接定义
语法：标签名称 {属性：属性值；}
实例： div { width: 30px}
所有的页面元素都可以作为选择符;
用法：
（1）如果想改变某个元素的默认样式时，可以使用标记选择符；
（2）当统一文档某个元素的显示效果时，可以使用标记选择符；

2、类选择器（ class选择器）：

类选择器使用必须要通过引用才能生效

   语法：.class名称{属性：属性值;}

用法：class选择符更适合定义一类样式；
(1)当我们使用类选择符时，应先为每个元素定义一个类名，
(2)类选择符的语法格式：

    如：

           .top{属性:属性值;}

3、ID选择器：

语法： <div id=“id名”</div
例如： #id名{属性：属性值;}
说明：
（1）可以给每个元素使用id选择符，但id是元素的唯一标识符，不可出现重复的id名；

  如：<div id="top"></div>

（2）id选择符的语法格式是“#”加上自定义的id名

  如：#box{width:300px; height:300px;}

(3) 起名时要取英文名，不能用关键字：(所有的标记和属性都是关键字)

  如：head标记

(4)一个id名称只能在文档中出现一次，因为id是唯一的
(5) 最大的用处：创建网页的外围结构。

4、通配符：*

语法：*{属性：属性值;}

  说明：通配选择符的写法是“*”，其含义就是所有元素；表示该样式适用所有网页元素；

用法：常用来重置样式。

5、伪类选择器：

a:link {color: #FF0000;} / 未访问的链接 /
a:visited {color: #00FF00;} / 已访问的链接 /
a:hover {color: #FF00FF;} / 鼠标移动到链接上 /
a:active {color: #0000FF;} / 选定的链接 /
注意：

   按照以上顺序编写都可正常显示样式，否则有些状态不能正常显示

6、群组选择器（集合选择器）

语法：选择器1，……，选择器5 {属性：属性值;}
说明：当有多个选择器应用相同的样式时，可以将每个选择器用“，”分隔的方式，合并为一组。

  实例：.div, #div, p{width:100px;}

7、包含选择器(后代选择器)

语法：选择器1 选择器2{属性：属性值;}
说明：选择器1和选择器2用空格隔开，含义就是选择器1中包含的所有选择器2
实例： div ul li { height:200px; }

8、CSS选择器的权重

当不同选择符的样式设置有冲突的时候，高权重选择符的样式会覆盖低权重选择符的样式。
相同权重的选择符，样式遵循就近原则：选择符后定义样式优先被使用。
css中用四位数字表示权重，权重的表达方式如：0，0，0，0；
权重规则：
id选择符的权重为 0100
类型选择符的权重为0001
class选择符的权重为0010

群组选择符权重为他本身
包含选择符的权重：为包含选择符的权重之和
内联样式的权重为1000
继承样式的权重为0000

CSS中的选择器