CSS复合选择器

后代选择器

元素1 元素2 {样式声明}
元素2是元素1的后代,可以是儿子可以是孙子
元素1和元素2可以是任意的基础选择器
如：
ul li {}
ol li {}
ul a {}  这里的a可以是ul 后代的后代
Ul li a {}
.nav li a {}

子选择器

只能选择最近一级，即亲儿子
元素1>元素2 {样式声明}

div>p {样式声明} /*选择div最近一级的p*/

并集选择器

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

任何选择器都可以作为并集选择器

伪类选择器

1、链接选择器
a:link         /*选中未访问的链接*/
a:visited      /*选中访问过的链接*/
a:hover        /*选择鼠标经过的链接*/
a:active       /*选择的是鼠标正按下但是没有弹起的链接*/

一定要按照link,visited,hover,active的顺序写
因为a链接在浏览器中具有默认样式，所以我们实际开发中都需要给链接单独指定样式。

在实际开发中的写法：
a {
  color: gray;
  text-decoration: none;
  }
a:havor {
    color: red;
    text-decoration: underline;
    }
    
2、:focus伪类选择器
用于选取获得焦点的表单元素
焦点就是光标，一般情况下<input>类表单元素才能获得，因此这个选择器主要针对表单元素
input:focus {
    background-color: yellow; /*这个是表单的背景*/
    color: red;  /*这个是输入的文字会呈现的颜色*/
    }