CSS选择器优先级 && CSS选择器效率

mportant>行内样式>id选择器>类选择器|伪类|属性选择器>标签>通配符>继承>浏览器默认样式

!important > 内联样式 > ID选择器 > 类选择器(属性选择器、伪类选择器)> 元素选择器(伪元素选择器)> 通配符选择器


关于CSS的执行效率

样式系统从右向左匹配规则。只要当前选择符的左边还有其他选择符,样式系统就会继续向左移动,直到找到和规则匹配的元素,或者因为不匹配而退出。

是因为从右向左的匹配在第一步就筛选掉了大量的不符合条件的最右节点(叶子节点);而从左向右的匹配规则的性能都浪费在了失败的查找上面。

posted @ 2023-02-10 16:50  芬-mi  阅读(23)  评论(0编辑  收藏  举报