zoukankan      html  css  js  c++  java
  • css声明的优先级

    选择器的特殊性
      选择器的特殊性由选择器本身的组件确定,特殊性值表述为4个部分,如0,0,0,0,0
      一个选择器的具体特殊性如下确定
      1、对于选择器给定的ID属性值,加0,1,0,0
      2、对于选择器中给定的各个类属性,属性选择,或伪类,加0,0,1,0
      3、对于选择器中给定的各个元素和伪元素,加0,0,0,1
      4、通配符的选择器的特殊性为0,0,0,0
      5、结合符对选择器特殊性没有一点贡献
      6、内联声明的特殊性都是1,0,0,0
      7、继承没有特殊性 

      总结:
      内联样式,优先级1000
      id选择器,优先级100
      类和伪类,优先级10
      元素选择器,优先级1
      通配符,优先级0
      继承的样式,没有优先级

      当选择器中包含多种选择器时,需要将多种选择器的优先级相加然后再比较,

      但是注意,选择器优先级计算不会超过他的最大的数量级,如果选择器的优先级一样,则使用靠后的样式

      并集的选择器的优先级是单独计算

      特殊性1,0,0,0大于所有的以0开头的特殊性(不进位)
      选择器的特殊性最终都会授予给其对应的声明
      如果多个规则与同一个元素匹配,而且有些声明互相冲突时,特殊性越大的越占优势

      注意:id选择器和属性选择器
      div[id="test"](0,0,1,1) and #test(0,1,0,0)
      重要声明
      有时某个声明比较重要,超过了所有的其他声明,css2-1就称之为重要声明
      并允许在这些声明的结束分号之前插入!important来标志
      必须要准确的放置!important 否则声明无效
      !important总是要放在声明的最后,即分号的前面

      标志位!important的声明并没有特殊性值,不过要与非重要声明分开考虑
      实际上所有的重要声明会被浏览器分为一组,重要声明的冲突会在其内部解决(然后再去判断选择器的优先级)
      非重要声明也会被分为一组,非重要声明的冲突也会在其内部解决
      如果一个重要声明与非重要声明冲突,胜出的总是重要声明

      继承
      继承没有特殊性,甚至0特殊性都没有
      0特殊性要比无特殊性来的强
      来源
      css样式的来源大致有三种
      创作人员
      读者
      用户代理

      权重:
      读者的重要声明(用户,就是直接在浏览器写的样式)
      创作人员的重要声明
      创作人员的正常声明
      读者的正常声明
      用户代理的声明(浏览器)

      层叠
      1.找出所有的相关规则,这些规则都包含一个选择器
      2.计算声明的优先级
      先按来源排序
      再按选择器的特殊性排序
      最终按排序

  • 相关阅读:
    Oracle——Hint
    Oracle——package....包的概念和定义
    Oracle——sql语句执行步骤以及提高sql基本查询效率
    Oracle函数之捡漏篇
    Oracle 分析函数Over(partition by...)以及开窗函数
    初尝RabbitMQ消息队列
    Gerrit部署成功后project下不显示clone地址
    jenkins打包iOS 报错:error: exportArchive: The data couldn’t be read because it isn’t in the correct format.
    gerrit 版本下载
    grep -w ,grep -e,grep -v的使用
  • 原文地址:https://www.cnblogs.com/caicaihong/p/9144377.html
Copyright © 2011-2022 走看看