Dan*_*007 4 html css google-chrome
当有人在Google Chrome控制台日志中显示重复的css选择器时,有人可以解释一下这个问题吗?为什么第二个实例有通过它的行.
我猜这是一个我需要解决的编码错误.
仅供参考 - 根据下面的屏幕截图,两个.items都来自同一个css文件.

看来是因为在文件中找到了两次CSS.
crossed out line表示已找到这些样式但已被覆盖.
简而言之, display:block 就像控制台一样,意味着应用了CSS,但随后发现了一些更相关的 CSS并覆盖了当前的CSS.
例如,如果你有像这样的标记:
<html>
<head>
<style>
h2#title{color : red}
h2#title{color : yellow}
</style>
</head>
<body>
<h2 id="title"> Hi </h2>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
然后,因为h2#title在文件中找到两次,只能应用一个,所以,你会看到这样的东西,无论哪个被覆盖都会被克服:
h2#title{
color : red
}
很好的阅读: https ://developer.chrome.com/devtools/docs/elements-styles?csw = 1 &safe = on #computed_style
相关帮助主题: Chrome开发者工具:如何找出覆盖CSS规则的内容?