html选择器

常用选择器

    元素选择器：根据标签名来选择指定的元素，语法：标签名{}
            例：p{} h1{} div{}
    p{
        color: red;
    }
    h1{
        color: blueviolet;
    } 
        id选择器
            作用：根据id属性值选中一个元素
            语法：#id属性值{}
            例：#box{}
    #red{
        color:red;
    }
    .red{
        color: red;
    }
       类选择器
        作用：根据元素的class属性值选中一组元素
        语法：.class属性值{}
       通配选择器
                作用：选中页面中的所有选择器
                语法：*{}
    */
    *{
        color:red;
    }

复合选择器
交集选择器：
作用：选中同时符合多个条件的元素
语法：选择器1选择器2选择器3…
注意：交集选择器中如果有元素选择器，必须以元素选择器开头
div.red{
font-size: 30px;
}
选择器分组（并集选择器）
作用：选择多个选择器对应的元素，逗号连接
h1,span{
color:green;
}
关系选择器
子元素选择器
作用：选中指定父元素的指定子元素
语法：父元素>子元素
兄弟元素选择器：
选择下一个兄弟
语法：前一个+后一个
选择下边所有的兄弟元素
前一个~后一个
属性选择器
[属性名]选择包含指定属性的元素
[属性名=属性值] 选择指定属性为指定属性名的元素
[属性名^=属性值] 选择属性以指定属性名开头的元素
[属性名$=属性值] 选择属性以指定属性名开头的元素
[属性名*=属性值] 选择属性名中包含指定属性名的元素
伪类的选择器
伪类（不存在的类，特殊的类）
用于描述元素的特殊状态
比如，第一个子元素，被点击的元素，鼠标移入的元素
伪类一般情况下以：开头
：first-child
以上这些伪类都是根据所有子元素进行排序的，
比如 ul>li:first-child表示ul的firstchild是li的子元素
:first-of-type
:last-of-type
:nth-of-type()
以上为类的功能和上述类似，不同点是他们在同类型元素中进行排序
:not()否定伪类
将符合条件的元素从选择器中删除
超链接的伪类
:link用来表示没访问过的链接（正常的链接）
:visited用来表示访问过的链接
由于隐私的原因，visited伪类只能修改链接的颜色
:active用来表示鼠标点击
visited和link是a标签独有的属性
hover和active所有属性共有
:hover 用来表示鼠标移入的状态
伪元素：表示页面中一些并不真实存在的元素（特殊位置）
伪元素使用::开头
::first-letter表示第一个字母
::first-line表示第一行
::after元素的结束位置
::before