html+css---css选择器

##通配符（*）

    * {
      margin:0;
      padding:0;  
    }

## 类选项器（class）

    <div id="box"></div>
        #box{   }

## id选择器

        <div class="box"></div>
        .box{   }

## 条件选择器（后代/子代/兄弟 选择器）

    div ul li{}            后代选择器
    div>ul>li{}            子代选择器
    .box+li{}             当前元素后面的的第一个兄弟   兄弟选择器
    .box~li{}             当前元素的后面所有的亲兄弟   兄弟选择器

## 结构选择器（结构伪类选择器）

1. li:first-child
  
2. li:first-of-type
  
3. li:last-child
  
4. li:last-of-type
  
5. li:nth-child(2) (2n)/(even)寻找偶数 （2n+1）/(odd)奇数
  
6. li:nth-of-type(2)
  

（3n+1）/(3n+2) 数字的含义 n 和 +1的意义

    ul>li:first-child        不会标签名分类
    ul>li:first-of-type{}    先分类：标签名分类
                    ul>li:last-child
                        ul>li:last-of-type{}
                    ul>li:nth-child(2)  (2n)/(even)寻找偶数     （2n+1）/(odd)奇数
                                （3n+1）/(3n+2)  数字的含义 n 和 +1的意义
                                    例 +3是开始     n值为（0，1，2，3...）        
                        ul>li:nth-of-type(2){}

## 否定选择器

语法：

    ul>li:not(:first-child){   } //满足条件以外的元素

## 伪类选择器

    div:hover    div:hover a{}
                            注：如果hover后面有其他选择器，设置样式的对象是后面的选择器中的元素
                    a:link          初始状态颜色
                    a:visited       访问之后
                    a:hover         鼠标移上
                    a:active        点击激活            （必须按顺序定义）因为：权重一样
                                input:focus{
                                    获取焦点设置样式
                                }

## 伪元素选择器

    div::before/::after        在元素（div）设置第一个子元素，必须与content属性连用，默认是行元素
                       元素前插入内容       
                    div::after  元素后插入内容
                    div::first-line     选择第一行     元素（div）必须是块元素
                    div::firdt-after    选择第一个字   元素（div）必须是块元素

## 属性选择器

    元素1[属性1]
                    div[class]              
                    div[class=box1]         要完全匹配（box1）
                    div[class~=box]         包含（box）就匹配
                    模糊查询是  class^=b     开头是b
                                class$=b    结尾是b
                                class*=b    包含是b

## 复合选择器（群组选择器）优先级

    并集:p:hover,h2:haver,span {}
                    div>ul>li  优先级高于   ul>li
                    div>ul>li  优先级低于   .item>li
                    .item>li   优先级相同   second li   权重一样