css标签笔记

1.元素选择器

        作用：用标签名来选择元素

        语法：元素名{}

        eg：h1{}   p{}      div{}

    2.id选择器

        作用：更具元素的id选中元素

        语法：#id属性值{}

        eg：  #red{}   #box{}

    3.类选择器

        作用：根据元素的class属性选中一组元素

        语法：.属性名{}

        可以同时为一个元素指定多个class，多个class之间使用空格隔开

        eg：class="box box1 box2"

    4.通配选择器  

        作用：选中页面中所有元素

        语法：*{}

    复合选择器

    1.交集选择器

        作用：选择同时符合条件的元素

        语法：选择器1选择器2选择器n{}

        注意：交集选择器中如果有元素选择器，必须使用元素选择器开头

    2.并集选择器（选择器分组）

        作用，同时选择多个选择器对应的元素

        语法：选择器1，选择器2，选择器n{}

    3.关系选择器

        父元素：直接包含子元素的元素

        子元素：直接被父元素包含的元素

        祖先元素：直接或间接包含后代元素的元素

                一个元素的父元素也是祖先元素

        后代元素：直接或间接被主线包含的后代元素

        兄弟元素：拥有相同父元素的元素

            1）子元素选择器： 语法：父元素>子元素

            2）后代元素选择器：选中指定元素的指定后代元素

                            语法：祖先 后代{}

            3）兄弟元素选择器：语法：选下面的一个兄弟：兄+弟{}

                                选下面所有的兄弟：兄~第{}

    属性选择器：

                [属性名]{}             选择含有指定属性的元素

                [属性名=书属性值]{}     选择含有指定属性和属性值的元素

                [属性名^=属性值]{}      选择属性以指定值开头的元素

                [属性名$=属性值]{}      选择属性以指定值结尾的元素

                [属性名*=属性值]{}      选择属性含有某值的元素

    伪类选择器：不存在的类 特殊的类 用来描述一个元素的特殊状态，比如第一个元素，被鼠标点击的元素，鼠标移入的元素...

                一般情况下都是使用冒号开头

                    ：firrst-child    第一个子元素

                    ：last-child      最后一个子元素

                    ：nth-child（）   选中第n个子元素     n  第n个

                                                        2n  或even  偶数个元素

                                                        2n+1  或odd   奇数个元素      以上伪类都是更具所有子元素排序

                    ：firt of type

                    ：last of type

                    ：nth of type

                    ：not（）否定伪类

                            将符合条件的元素重选择器中去除