选择器

Posted 2020-11-26 wxy0715

<!--
    ##简单选择器
1.ID选择器
2.元素选择器
3.类选择器
4.通配符选择器*{}
5.属性选择器  [元素名="#"]{}

6.伪类选择器  :hover  或者a:hover 鼠标悬停时的状态 # active{} a:active{} 鼠标按下的元素有效果（通常用在a元素中）## link 超链接未被访问的状态## visited超链接被访问过的颜色
  顺序  link visited hover active 
  更多的伪类选择器 1.first-child(选择第一个子元素)  li:first-child{}
                  2.last-child(选择最后一个元素)                  
                  3.nth-child(选定指定位置的子元素)  a:nth-child(5){} even=2n偶数 odd奇数
                  4.nth-of-type(某类型的第几个元素)
                  5.first-of-type (选择指定的第一个)
                  6.last-of-type(选择指定的最后一个)

7.伪元素选择器## ::after和before
  更多的伪元素选择器 1.first-letter(选择元素中第一个字母)
                   2.first-line(选择第一行的文字)
                   3.selection(选择被用户框选的元素)
   
    ##选择器的组合
1.后代元素 -空格  .red #
2.子元素->        div>ul>li{} 
3.相邻兄弟元素-+  .red+li{}   
4.兄弟元素-~      .red~li{}

  ##选择器的并列


-->