html - 具有两个类的元素的CSS选择器不起作用

我正在尝试设置这些元素的样式，并且具有两个类的元素的样式不能与具有一个类的元素的样式不同。我也尝试用.red.balls选择它，但是它不起作用。

.ballsAll {
  display: block;
  margin-left: 14%;
}
.red {
  background-color: red;
}
.balls {
  background-color: white;
}

<div class='ballsAll'>
  <p>
    <span class='balls'>22</span>
    <span class='balls red'>11</span>
  </p>
</div>

最佳答案

在.red之前声明.balls，如下所示：

.ballsAll {
  display: block;
  margin-left: 14%;
}
.balls {
  background-color: white;
}
.red {
  background-color: red;
}


<div class='ballsAll'>
  <p>
    <span class='balls'>22</span>
    <span class='balls red'>11</span>
  </p>
</div>

关于html - 具有两个类的元素的CSS选择器不起作用，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/34926315/