如何在Chrome开发者工具中过滤和显示仅应用的CSS(如Firefox中的Firebug)

时间:2013-05-27 09:29:34

标签: css google-chrome firebug firebug-lite

背景故事:我有一个包含多个CSS的页面,它们相互覆盖。有很多划掉的CSS样式,所以我不想看到它们。

我知道Firefox上的Firebug提供了这个功能(仅显示应用的CSS),它可以显示CSS文件应用的CSS样式(整洁!)。

我们如何在Chrome上使用此功能?我尝试安装Firebug Lite for Chrome但没有运气。

PS:Chrome有Computed Style选项卡,但它没有显示什么样的样式来自CSS文件。

1 个答案:

答案 0 :(得分:6)

在Chrome开发工具的右侧栏(其中CSS显示在“元素”面板中)中,第一部分称为“计算样式”。如果取消选择“show inherited”,您将获得实际应用于该元素的样式的整齐列表。这有帮助吗?