css的复合器选择

1.后代选择器（重要）

后代选择器又被称为包含选择器，可以选择父元素里面子元素。其写法就是把外层标签写在前面，内层标签写在后面，中间用空格分隔，当标签发生 嵌套时，内层标签成为外层标签的后代
语法：

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

上述元素表示选择元素1里面的所有元素2（后代元素）
例如

ul li{
         样式声明（选择ul里面所有的li标签元素）
}

• 元素1 和元素2 中间用空格隔开
• 元素1是父级元素2是子级，最终选择的是元素2
• 元素2 可以是儿子也可以是孙子，只要是元素1的后代即可
• 元素2和元素2可以是任意基础选择器

2. 子选择器（重要）

子元素选择器（子选择器）只能选择作为某元素的最近一级子元素。简单理解就是选亲儿子元素
语法

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

上述语法表示选择元素1里面的所有直接后代（子元素）元素2
例如

div>p {
        样式声明     :（选择div里面所有 最近一级p标签元素）
}

• 元素1和元素2中间用大于号隔开
• 元素1是父级，元素2是子级，最终选择的是元素2
• 元素2必须是亲儿子，其孙子，重孙子都不归她管，因此也可以叫（亲儿子选择器）

并集选择器（重要）

并集选择器可以选择多组标签，同时为他们定义相同的样式，通常用于集体的声明
并集选择器是个选择器通过英文逗号（，）连接而成，任何形式的选择器搜可以作为并集选择器的一部分
语法

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

上述语法表示选择元素1和元素2
例如

ul ,div  {  样式声明 }（选择ul和div标签元素）

1. 元素1 和元素2中间用逗号隔开
2. 逗号可以理解为和的思想
3. 并集选择器常用于集体声明

3. 链接伪类选择器

a:link 选择所有未被访问的链接
a：visited 选择所有已经被访问的链接
a:hover 选择鼠标指针位于其上的链接
a：active 选择活动链接（鼠标按下未弹起的链接）
注意事项

1. 为了确保生效，请按照LVHA的顺序声明：link-：visited -：hover -：active.
2. 记忆：lv包包hao
3. 因为a链接在浏览器中具有默认样式，所以我们实际工作中都需要给链接单独指定样式
   链接伪类选择器在实际工作中的写法：

a是标签选择器     所有的链接
a{
      color：gray
}
 ：hover是链接伪类选择器  鼠标经过

a：hover {
          color：red（鼠标经过的时候， 由原来的 灰色 变成了红色）
}

4.：focus 伪类选择器

：focus伪类选择器用于选取获得焦点的表单元素
焦点就是光标，一般情况类表单元素才能获取，因此这个选择器主要针对于表单元素来说`

input ：focus {
       background-color：yellow;
}

选择器的总结图