Chrome开发者工具中CSS规则的显示顺序

Question

3

我一直在使用Chrome开发者工具检查网页，注意到CSS规则是按字母顺序显示的。当我尝试跟踪应用于元素的规则通过所有祖先的继承时，我注意到这个问题。

有没有办法改变规则显示的顺序？或者可以使用其他工具来实现吗？

谢谢。

- Timur

4个回答

2

你可以自己编辑 "检查器"，它就是Html/Js。

查看 C：\ Users \--您的用户名--\ AppData \ Local \ Google \ Chrome \ Application \ --最新版本--\ Resources \ Inspector

由于您正在使用工具，我假定您知道如何编辑它们 :)

- Hailwood

这个路径是哪个版本的Windows？对于XP来说，路径是

C:\Documents and Settings\username\Local Settings\Application Data\Google\Chrome\Application\Latest version\Resources\Inspector

。此外，我看到这个JS文件有45337行...我觉得修改它并不容易 :) （如果他成功了，我想要那个修改后的文件！） - Sotiris

@Sotiris - Windows Vista和7使用C：\ Users路径。 - derekerdmann

2

我建议你使用Firebug Lite。虽然它不支持火狐浏览器中著名的Firebug的所有功能，但仍是Chrome浏览器的一个很棒的工具。

- Sotiris

1

如果您对Chrome没有特别的依赖，可以尝试一下Firefox扩展Firebug。它会在样式列表的顶部显示最具体的选择器，并按照与您正在检查的元素的接近程度，在下面列出父元素的级联样式。

- derekerdmann

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- user428407 · Accepted Answer

CSS规则以层叠顺序展示，而不是按字母顺序。因此，最上面的属性会覆盖下面的属性。如果您有一个反例，请使用crbug.com（在摘要中提到DevTools）或使用webkit.org/new-inspector-bug链接进行提交。