Chrome开发者工具：如何找出覆盖CSS规则的内容？

Question

嗯，这非常简单。如果Chrome的开发人员工具向我显示某个样式被覆盖，那么如何查看哪个CSS规则会覆盖它呢？

我想知道是否有类似“告诉我覆盖这个”的内容。

OBS： 请不要指向Firebug。

Answer 1

使用元素检查器的 Computed Style 面板。展开感兴趣的属性以查看适用规则列表以及赢得哪个规则。

Answer 2

您可以简单地查看同名的未被删除的内容，请记住列表的重要性。

或者您可以查看计算出的样式。它们将是实际应用的样式。

Answer 3

crtrl + shift + c并检查元素。然后在右下角的框中找到没有穿过它的样式。

覆盖在大多数情况下位于顶部（并且没有通过它的线，因为这种风格是“获胜”）。