有没有办法找出css规则的来源？

Question

道歉，如果这是一个重复的问题，虽然我已经搜索了一个解决方案而没有找到解决方案。

我继承了一个.asp网站，不得不更新页面以将表格中的表格重新定位到侧边栏。

除了一页之外，它在所有页面上都运行良好，它固执地拒绝接受我的CSS并从谁知道在哪里获取价值。

我已尝试在Firefox / Chrome中进行调试，甚至在页面的头部编写规则但无济于事。是否有识别此类事物的工具？我对css并不吝啬，但这令我感到困惑。我不想诉诸javascript来解决这个问题，因为我认为这是一个基本问题。

网址为： leads2trade _solar

***现在回答 - 调试工具告诉css故事，但不要标记编码错误的HTML！感谢所有人的帮助。

Answer 1

您可以在Chrome中使用网络检查器。

右键单击失败的元素并选择inspect元素。

您最终应该使用两个部分的Web检查器窗口：左边是html节点树，右边是所选节点的样式和属性。应该选择失败的元素。

接下来，您需要展开“计算样式”标签并查找有问题的样式。

找到后，您会看到样式定义左侧的小三角形 - 它是可点击的。单击它时，应展开影响此元素的此样式的选择器列表。你会看到每个网址都有网址。宾果

Answer 2

正如奥斯汀和Waterlink所指出的，计算样式（或FF中的计算）标签可以显示当前应用的样式及其来源。

但是，样式标签也非常有用。右键单击元素上的“检查”后，“样式”选项卡将显示所有活动样式的完整列表以及与被检查元素相关的覆盖样式。 （显示它们是在CSS中编写的。不是实际呈现的内容） 这样你就可以知道哪种样式被覆盖了哪种顺序。 css中的样式可以从内联样式，用户定义样式，后来定义的css文件或更高重要性的css规则覆盖，甚至可以直接在HTML元素上覆盖非css属性（如width / height属性）

格式显示样式的状态：

• 普通文字=有效
• 通过=非活动，因为另一种风格已覆盖它
• 灰色显示=未应用标识符。 （如果您正在检查<p>元素的样式且css标识符为p, span，则span标识符将显示为灰色）

示例：

在此图片中，color的{​​{1}}属性无效。它已被#post a中的color属性覆盖。

Answer 3

在Firebug的HTML标签中，您应该会在右侧看到一个面板，其中包含标签Style，Computed，Layout和DOM。选择Computed。这将显示正在应用于页面的“当前”样式。

如果展开规则节点，您应该在右侧看到一个链接，显示它来自哪个样式表，以及被覆盖的样式表规则。