选择器优先级不生效怎么办_分析层叠顺序和来源权重

哈喽！大家好，很高兴又见面了，我是golang学习网的一名作者，今天由我给大家带来一篇《选择器优先级不生效怎么办_分析层叠顺序和来源权重》，本文主要会讲到等等知识点，希望大家一起学习进步，也欢迎大家关注、点赞、收藏、转发! 下面就一起来看看吧！

样式被划掉是因为 specificity 权重低于其他规则，需对比权重值（如 0,1,1,0）；CSS 层叠还受来源顺序影响，后加载样式优先；提权应优先用精准选择器而非 !important；继承属性不参与优先级计算，需在 Computed 面板确认是否真被应用。

样式被划掉？先看开发者工具里的 specificity 数值

样式“不生效”绝大多数时候不是写错了，而是被更高优先级的规则覆盖了——浏览器在 Styles 面板里用横线划掉你的声明，鼠标悬停会提示 specificity is lower than another rule。这时候别改属性值，先点开那条被划掉的样式，看它右边显示的权重（比如 0,1,1,0 或 110），再对比覆盖它的那条规则的权重。

• ID 选择器（如 #header）算 100，类/伪类/属性选择器（如 .btn、:hover、[disabled]）各算 10，元素（如 div、p）各算 1
• 嵌套层数本身不加权，但长链如 .container .list .item a 累计了 3 个类 + 1 个元素 = 31，很容易压过你后来写的 .item-link（仅 10）
• 行内样式 style="margin: 20px" 权重是 1000，几乎无法被外部 CSS 覆盖（除非加 !important）

为什么改了 .class 还是没用？检查样式来源顺序和加载位置

CSS 的层叠（cascade）不仅看选择器权重，还严格按「来源 + 顺序」裁决：内联 > ID > 类 > 元素；同权重时，后定义的赢。但很多人忽略的是，样式来源本身就有天然排序：

• 外部样式表（）优先级低于内部样式（