CSS拓展选择器 组合选择器 后代选择器 交集选择器 伪类选择器

1.组合选择器

组合选择器又称为并集选择器。它可以将同样的样式规则应用于多个选择符。简单的说就是在多个不同的选择器中存在多个相同的样式，那么就可以将这些相同的样式提取出来放在一起，这种组成的选择器叫做组合选择器

语法格式：

标签名,标签名,标签名{属性:属性值;属性:属性值;属性:属性值；}

p,.red,#news{color:red;font-family:"宋体";}

组合选择器中，可以将三种基础的选择器的标签放在一起，中间使用逗号隔开，然后在括号内将相同的样式写在一起。使用组合选择器能够很好的降低冗余，方便样式的后期处理和修改

2.后代选择器

后代选择器又称包含选择器。它主要作用的范围是选择元素下的后代元素。就相当于p标签内的span标签。p标签为父级元素 span为子级元素。作用对象就是p标签下的span标签内的内容

语法格式:

父级标签 子级标签{属性:属性值;属性:属性值;}

p span{color:blue；font-size:12px;}

如上所示，后代选择器能够精准的选择页面元素进行样式的修改，而且更加的灵活。在使用后代选择器的时候要注意语法格式，父级元素和子级元素之间使用空格隔开

3.交集选择器

交集选择器是由两个选择器之间的连接构成，即该选择器中的选择元素即属于a标签，也属于b标签。

语法格式:

标签名.类名#标识名{属性:属性值;属性:属性值;}

如上所示，交集选择器的作用范围就是多个标签中都含有的内容，在语法格式上没有太大的要求，不同的选择器之间不能有空格，直接连续书写即可。交集选择器在实际开发中使用场景较少，只需了解即可

4.伪类选择器

伪类选择器就是根据标签处于某种状态下的修饰样式，例如鼠标经过时，字体颜色变成红色，这种方式都是采用了伪类选择器

语法格式:

标签名:伪类名{属性:属性值;属性:属性值;}

下面列举几个常用的超链接伪类

a:link (表示未点击访问时的超链接样式)

a:hover(表示鼠标经过时的超链接样式)

a:visited(表示已经访问过后的超链接的样式)

如上所示，采取的是超链接的伪类选择器中的hover方法，即当鼠标悬浮到超链接上，它的字体颜色就会自动变成粉色，在伪类选择器中除了超链接伪类还有其他的伪类选择器。