在 Firebug 中，如何判断什么是覆盖样式？答案

【问题标题】：In Firebug, how to tell what is overriding a style?在 Firebug 中，如何判断什么是覆盖样式？
【发布时间】：2023-03-23 18:30:02
【问题描述】：

我有这个 CSS：

fieldset li {  
padding-bottom: 0em;  
}

但是，它的行为不正常，并且使用 firebug，我看到该样式有一条线穿过它，表明它已被覆盖。 firebug 有没有办法告诉什么覆盖了样式？

在样式选项卡中，这是全部我看到了：

fieldset li {
clear:left;
float:left;
padding-bottom:1em;
width:100%;
}
Default.CSS (line 42)
fieldset li {
padding-bottom:0;
}
Default.CSS (line 27)
Inherited fromol
fieldset ol {
list-style-image:none;
list-style-position:outside;
list-style-type:none;
}
Default.CSS (line 23)
Inherited fromtable#ctl00_ContentPlaceHolder1_ScorecardEdit1_frmEdit
element.style {
border-collapse:collapse;
}

当我转到计算选项卡时，我看到它的 padding-bottom 为 16px。我怎样才能知道这是从哪里来的？

到目前为止，所有答案似乎都暗示我应该在样式选项卡中查看所有应用的样式（我发誓这是我上次使用 firebug 时的工作方式)，但这次我没有看到所有样式！

（我正在运行 Firebug 1.5.2）

解决方案

我是个白痴。这是由这个引起的（它正盯着我的脸）：

fieldset li {
clear:left;
float:left;
padding-bottom:1em;
width:100%;
}

是 em 让我失望了。这就是你在不理解的情况下从网络复制/粘贴 CSS 时得到的结果。

【问题讨论】：

标签： css firebug

【解决方案1】：

它们是排序的，所以最上面的定义会覆盖下面的定义。

【讨论】：

@tbone：如果这仍然不能解决您的问题，请向下滚动，有时覆盖器不在顶部，例如在带有!important 的规则中

【解决方案2】：

划掉的样式之上的样式通常会覆盖它。如果不是这种情况，请开始单击禁用样式图标并查看问题所在。

【讨论】：

这就是为我解决的问题.....我不知道禁用样式功能，所以这帮助我弄清楚了。
另请注意，如果样式标记为“！important”，它将覆盖其上方的所有样式

【解决方案3】：

如果 CSS 规则被覆盖，尽管它是该属性的最顶层规则，请进一步向下查找设置了 !important 覆盖的规则。

【讨论】：

【解决方案4】：

只需找到该属性名称的实例，该实例未被划掉，即覆盖。

【讨论】：

【解决方案5】：

如果您选择了有问题的行为不端的项目，它应该会为您提供应用到它的所有样式的列表。底部应该有最具体的样式。如果您从 fieldset li 样式开始，您应该能够向下滚动，直到看到已覆盖它的样式。

【讨论】：

“如果你选择了有问题的行为不端的项目，它应该会给你一个应用到它的所有样式的列表”......这也是我的想法，但这似乎只在计算样式选项卡...