18-选择器的权重

70 阅读1分钟

选择器的权重(优先级)

  • 当选择器相同时,根据代码位置不同:内联>内部~外部(就近原则)

  • 代码位置相同时,基础选择器的权重:

    • id>class=属性>标签选择器>通配符
  • 组合选择器:对基础选择器的权重进行叠加

    • 加法运算

      • 内联:1000
      • id:100
      • class&属性:10
      • 标签:1
    • 4个0 (0,0,0,0):

      • 内联:第一个0
      • id:第二个0
      • class&属性:第三个0
      • 标签:1
      • 从前往后依次比较,当前位的值相等,依次往后比较,值不等则直接以更大的为主,后面的不需要比较了。
    • 注意:当前计算方法不满足满十进一,也就是说一个class名始终大于标签

!important

  • 无视权重比较,直接在标签上作用当前样式,比内联优先级也更高(慎用)

    选择器{    css属性名:css属性值 !important;}