确定css样式优先级

Question

我想知道是否有人知道一个工具，当给出一些css文件/ css规则和一个选择器 - classname，id，element等时，返回所有适用于其优先顺序的样式。

我不是，这可以通过JavaScript实现 - 我可以在当时获得适用于某个元素的css规则，但是我可以获得那些被覆盖的吗？

Answer 1

在 Firebug 中，您可以看到任何元素的所有合格样式。它允许您跟踪优先顺序，但需要您使用Firefox。

（Firebug页面上的演示文稿图像实际上显示了这种行为。请注意，font-size选择器的h1已被更具体的.siteTitle类选择器覆盖。）

Answer 2

除非您正在寻找可以自动化的内容，否则Firebug实际上应该能够为您解决这个问题。在节奏上的元素上打开上下文菜单（右键单击），选择“Inspect element”并显示Firebug窗格。在右侧，您获得了与元素相关的所有CSS规则 - 被覆盖的那些规则都标有删除线文本：

http://getfirebug.com/html1.gif

Answer 3

尝试Iexplorer或Firefox的任何开发人员工具栏。他们中的大多数将能够准确显示将应用于元素的样式。我认为，例如Firebug（Mozilla Firefox的插件）可以显示将应用哪些样式，以及它们被其他样式覆盖的位置。祝好运 ;）。 编辑：IE Developer Toolbar也具有此功能。