你真的掌握样式优先级和选择器优先级吗？

css选择器以及优先级

1.样式优先级

• 最近的祖先样式比其他祖先样式优先级高
• "直接样式"比"祖先样式"优先级高
• 选择器优先级

  内联样式 > id选择器 > 类选择器 = 属性选择器 = 伪类选择器 > 标签选择器 = 伪元素选择器

  • 组合选择符
    • 分类
      1. 后代选择符

         .a .b{}

      2. 子选择符

         .a > .b{}

      3. 相邻选择符

         .a + .b {}

    • 选择符优先级

        1.计算id选择器的个数（a）
        2.计算类选择器、属性选择器、伪类选择器的个数（b）
        3.计算标签选择器、伪元素选择器的个数（c）
        对比a、b、c的个数，相等则比较下一个
        若都相等，则按照“就近原则”比较
      

    • 属性后面加 !important 拥有最高优先级，若两个样式都有此设置，则对比选择器优先级