Actual webpage
我正在尝试在网页上显示代码片段。我是CSS新手，无法创建深色背景来显示我的代码片段。
当我创建一个名为“ test”的类（应该覆盖所有其他背景规范，对吗？）并将其分配为blue的color属性和black的background属性时，blue会在pre标签中显示，但是背景仍然是默认值颜色。
当我切换到span标签并在其中分配类时，这两个属性均按照我的命令工作。但我不想使用跨度，因为我的讲师说非语义标记是一种不好的做法。某事告诉我，我需要以某种方式覆盖pre标签的某些固有属性。
有任何想法吗？如果适当/必要，我可以在此处发布代码。
编辑：我在这里发布了代码的缩写版本。我对其进行了测试，并在这里遇到了同样的问题。希望用更少的代码可以更轻松地找出问题所在。
这是HTMl：
<!DOCTYPE html>
<head>
<title>Test</title>
<link type="text/css" rel="stylesheet" href="stylesheets/test.css">
</head>
<body>
<p>
<pre class="test">test</pre>
</p>
</body>
</html>
现在的CSS：
.test {
color: blue;
font-weight: bold;
background: black;
}
pre {
font-family: monospace;
font-size: 1.25em;
text-align: left;
line-height: 0px;
background: black;
}
最佳答案
规则越具体，覆盖父类或ID的可能性就越大。试一试...
.snippets div{
background-color: #F00;
}
.snippets div.no_code{
background-color: #000;
}
<div class="snippets">
<div> </div>
<div> </div>
<div> </div>
<div class="no_code"> </div>
<div> </div>
<div> </div>
</div>
关于html - CSS中的背景属性行为异常，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/33852380/