如何查看课程的所有CSS规则？

Question

假设我有几个css文件：

//first.css
my-style {
    color: blue;
}

//second.css
my-style {
    font-weight: bold;
}

有没有办法输入课程名称＆＃34; my-style＆＃34;并在整个html页面中查看所有css文件中的所有规则？ （对Firefox，Chrome和Opera感兴趣）。

Answer 1

不，我在任何浏览器中都不知道任何此类功能。而且我认为它也没有意义。例如，假设您遵循以下两种样式规则：

#someId .someClass{
  //rule set 1
}

.someClass {
  //rule set 2
}

那么，现在拥有.someClass的所有规则意味着什么？正如您可以清楚地看到的那样，某些规则将适用于某些元素，而其他规则将适用于其他元素。有了CSS所具有的所有特殊性和重写规则，具有相同类的两个元素可以具有非常不同的样式。

确实有意义且Chrome支持的是查看元素的计算样式规则。如果您正在调试一个问题，您可以找出哪个规则搞乱了您的设计，然后您可以查找特定链以找出有问题的规则。