7.复合选择器
作者：互联网
之前我们提到过选择器由基础选择器与复合选择器构成，现在我们说一下复合选择器
复合选择器是将两个或更多个基础选择器复合到一起，这样选择起来更方便，复合选择器包含后代选择器，子选择器，并集选择器，伪类选择器等，常用的就是我们提到的这四个
目录
1 后代选择器
后代选择器也叫包含选择器，它可以选择父元素里面的子元素
我们当前有一个有序列表与一个无需列表，里面都有若干项
我们现在想将ol中的li与ul中的li设置为不同的样式，那么我们应该这样写
效果是这样的
这个就是后代选择器，它的语法是这样的
元素1包含元素2，改的是元素2的样式，并不会动元素1的样式
元素1不一定直接包含元素2，间接包含元素2也可以，比如
这样它span中的内容就是黄色的
为了选择更加准确，我们也可以写多级
也是可以生效的
他也可以配合类选择器来使用，比如我们现在有两组几乎相同的ul
我现在想让第二个ul中的两个div自己搞一种样式，那么我们应该这样做
发现可以生效
2 子选择器
子选择器只选择最近一级的子元素，子元素选择器是这样的
- 同样只对元素2进行修改，元素1不进行修改
我们做一个例子
发现这样它只改变了第二个p，而没有改变第一个p
3 并集选择器
通常用于集体声明，比如我想让div和p的样式相同，我就可以用并集选择器，它的语法是这样的
- 改元素1，也改元素2
我们做个例子
这样他们的样式就是相同的
也可以和后代选择器混着用
- 注意最后一个元素不要加逗号，加了就用不了了
4 伪类选择器
伪类就是内容的状态，比如这个
在我鼠标没放上去的时候，它是这样的
放上去之后它变色了
这个用的就是伪类选择器
伪类选择器包含很多，我们这里先讲链接伪类选择器，伪类选择器用冒号表示，冒号后接伪状态
4.1 链接伪类选择器
链接中我们常使用这四个伪状态
我们用一下这四个，我们让链接未访问为红色，访问过为紫色，鼠标停在上面为蓝色，按完了不放手为绿色
- 一定要按照link,visited,hover,activate的顺序来写，不然有的css会不生效
打开后是这样的
我把鼠标移动到这是这样的
按住不放手是这样的
点完之后是这样的
链接是有默认样式的，通过body是不能改变链接的样式的
4.2 focus 伪类选择器
用于改变元组获取焦点时的状态，我们用一下
打开之后是这样的
现在我们点一下文本框
当文本框获取到焦点时，它就会变成我们想要的样式
标签：伪类,样式,元素,复合,我们,选择器,这样 来源： https://blog.csdn.net/potato123232/article/details/123088298