特指度和层叠

    技术2022-07-10  94

    特指度

    特指度是指不同样式的‘权重’,例如:

    指向ID的样式声明对应的特指度为“0,1,0,0”指向类名和属性值的特指度为“0,0,1,0”元素和伪元素(:link,:after等)的特指度为“0,0,0,1”行内样式(在标签内部声明的样式)的特指度为“1,0,0,1”通配符的样式是0特指度通过继承获得样式的是无特指度的

    特指度是可以叠加的,当多个规则对应的同一个样式的话,就会根据特指度的大小进行选择(大的优先)

    层叠

    当多个规则的特指度相同时,就需要根据层叠的准则:

    找到匹配特定元素的所有规则存在 !important声明的样式大于其他不存在 !important的样式。当存在多个 !important, 行内样式大于其他。导入的样式表放在当前样式表中所有声明的前面按照特指度排序应用到特征元素上的所有声明。特指度高的具有较高权重当两个样式的来源、显示权重(!important)和特指度相同的话,根据样式表中前后位置选择,靠后的胜出。

    参考 《ES6标准入门》

    Processed: 0.032, SQL: 9