3

我有两种css样式,其中第二种我只想在第一种出现时生效。我该怎么做呢?我知道您可以将多个类添加到类标记中,但是以相同的方式嵌套 css 标记似乎不起作用。

.stat{float: left; width: 200px; height: 40px; padding: 5px; margin: 5px; border: 1px solid #000;}
.stat .red{background-color: #c00;}


<!-- This should have the background color -->
<div class="stat red">

<!-- This should not have the background color -->
<div class="red">

<!-- This should not have the background color -->
<div class="stat">
4

2 回答 2

6

只留下空间:

.stat.red{background-color: #c00;}
于 2013-01-11T18:12:03.743 回答
3

只是为了澄清

.stat .red { ... }

或者更准确地说,类名之间的“”称为后代选择器。在您的情况下,这意味着只有具有类“red”的元素,即具有类“stat”的元素的后代才会成为目标。例如

<div class="stat">
   <div class="red"></div>
</div>
于 2013-01-11T18:41:24.867 回答