css选择器总结

dany04
    选择器
    1.核心选择器
        标签选择器
            div{}
        id选择器
            #one{}
        class选择器
            .second
        逗号选择器
            div,#id-name{}
        组合选择器
            div#one{}
        普通选择器
            * 一般不单独使用
    
    （宽度加给父元素，高度加给子元素）            

    2.层次选择器
        子元素选择器
            .nav>ul>li>{}
        后代选择器
            .nav li{}
        下一个兄弟选择器
            products> li.ios~*{}
        之后所有兄弟选择器
            .products > li.ios ~ *{}
    3.属性选择器
        与状态相关
            selector[]
                input[type=text]
                input[type^=t]  以t开头
                input[type$=t]    以t结尾
                input[type*=t]    包含t的
        与子元素相关


    4.伪类选择器
        与状态相关
            :link  a标签还未被访问
            :hover  光标悬浮到元素上
            :active  a标签激活
            :visited  a标签访问过

        与子元素相关
            :first-child  子元素的第一个
            :last-child  子元素的最后一个
            :nth-child(v)  子元素中指定一个，隔行变色
                v  为数字，公式（2n、2n+1...）、关键字（Odd、even（匹配下标是奇数、偶数的子元素）
            ：first-of-type  子元素每一种种类的第一个
            ：last-of-type  子元素每一种种类的最后一个
            ：nth-of-type(v) 子元素指定一种种类
               v  为数字，公式（2n、2n+1...）、关键字（Odd、even（匹配下标是奇数、偶数的子元素）

    5.伪元素
        ::after
        ::before
        副作用：在dom节点中产生一个新节点

    position:relative
    position:absolute