H5-前端学习-03CSS选择器的认识与了解

        哈喽，各位小伙伴，我们会更新一些前端的文章，想学习前端的小伙伴，特别是0基础的小伙伴，或者对此感兴趣的小伙伴，可以关注我，我会保持更新。

 选择器：
            1.类选择器：
                语法：
                    HTML：<div class="box"></div>
                    CSS:.box{样式}
                    多个标签可以公用一个类名
                    一个标签可以有多个类名，不同类名之间用空格隔开
                优点：能够匹配不同类型的标签
                缺点：匹配范围有点广

            2.ID选择器：
                语法：
                    HTML：<div id="bobo"></div>
                    CSS：#bobo{样式}
                    一个标签只有一个ID名
                    ID选择器的取值只能出现一次
                优点：可以精准定位到具体的元素
            思考，不同选择器修饰同一个标签，样式会如何显示？
                标签选择器     类选择器      类选择器样式生效
                类选择器       ID选择器      ID选择器样式生效
                标签选择器     ID选择器      ID选择器样式生效
                通配符选择器权重：0
                标签选择器权重：1
                类选择器权重：10
                ID选择器权重：100
                行内样式权重：1000
                ！important>行内选择器>id选择器>类选择器>标签选择器>通配符选择器
            选择器权重不同，修饰同一标签，相同的属性被覆盖（权重高d的生效），不同的属性被保留
            选择器权重相同。修饰同一标签，后面代码覆盖前面代码（相同属性被覆盖掉），不同属性被保留

            3.群组选择器：
                语法：选择器1，选择器2，选择器3{样式}
                多个选择器公用一组样式

            4.关系选择器（后代选择器）
                通过某种关系去查找到指定的某一个标签或者某一类标签
                1.子代选择器：（类似父子关系）
                    符号：>
                2.后代关系选择器：（类似爷孙关系，能够找到当前元素包含的指定的标签）
                    符号：空格
            5.超链接动态伪类选择器（主要用在超链接上）
                :link------访问前
                :visited-----访问后
                :hover-----鼠标滑过(常用)
                :active----鼠标激活瞬间(鼠标点下去，没送开的状态)