css中的选择器

一、基本选择器

包含以下四种选择器:

1、标签选择器（根据标签的名称设置对应的样式）

2、ID选择器（通过获取标签里面的ID属性去设置对应的样式，设置的时候#+id的属性值）

3、类选择器（通过获取标签里面的class属性去设置对应的样式，设置的时候.+class的属性值）

4、通配符选择器（通过*设置对应的样式）

 四种的选择器的优先级： ID选择器>类选择器>标签选择器>通配符选择器

二、包含选择器

1、子代选择器（获取的某个标签的第一级子标签）

2、后代选择器（获取的某个标签的所有子标签）

3、分组选择器（也可称为逗号选择器，可以设定多个标签，使用逗号进行分割）

 

三、属性选择器

1、选中某个标签 中存在的某个值用 .container[class]

2、确切的等于某个值用input[type="text"]

3、属性里面包含某个值用input[type*="e"]

4、属性中的值以xxx开始用input[type*="e"]

5、属性中的值以xxx结尾用input[type $="e"]

6、表示下一个标签用.msg + p

7、属性等于某个值用[title="这是一个标题"]

 四、伪类选择器

伪类:同一个标签，在不同的状态下有不同的形式，伪类通过冒号表示

最早的时候主要用来渲染a标签不同的状态下的不同的样式

超链接点击之前-----------：link

超链接被访问之后---------：visited

鼠标放在超链接上的时候（悬停）---------：hover

超链接激活的时候（鼠标点击标签但是不松手的时候）---------：active

五、伪元素选择器

：before------css2中

：after-------css2中

：：before-------css3中

：：after--------css3中

注意：使用before和after的时候一定要给写上content属性