使用第一个孩子（div.multiple-alerts .normal：first-child span），第3行的CSS不会应用颜色。
https://jsfiddle.net/Lh6cpzeb/
div.multiple-alerts .high:first-child span{ color: yellow; }
div.multiple-alerts .normal:first-child span{ color: yellow; }<div class="multiple-alerts">
<div class="cls high"><span>high</span></div>
<div class="cls high"><span>high</span></div>
<div class="cls normal"><span>normal</span></div>
<div class="cls normal"><span>normal</span></div>
</div>
答案 0 :(得分：1)
正在以正确的方式应用CSS，但我认为您对规则如何工作的理解可能略有不同。您正在选择课程div的所有multiple-alerts的第一个孩子，该课程的课程类别为normal。好吧，multiple-alerts的第一个孩子没有班级normal（至少在你所包含的片段中），所以你的选择器恰好匹配零元素。
现在，您可能会想要first-of-type这样的东西，但这只适用于标签，而不适用于类。所以，这是一个有用的解决方法：
我们假设这些span s的标准颜色是黑色，我们会将span内的所有.normal设置为黄色，然后覆盖所有div.multiple-alerts .normal span {
color: yellow;
}
div.multiple-alerts .normal ~ .normal span {
color: black;
}
第一个，像这样：
~如果您不确定这是如何运作的，+与+的工作方式类似，但范围更广。 ~只能与下一个兄弟匹配，而echo "<table>";
echo "<tr>";
echo "<th>Transaction ID</th>";
echo "<th>Sender</th>";
echo "<th>Receiver</th>";
echo "</tr>";
$resultuser = mysqli_query($conn, "SELECT * FROM users");
$rowuser=mysqli_fetch_array($resultuser);
$resulttrans = mysqli_query($conn, "SELECT * FROM transactions");
$rowtrans=mysqli_fetch_array($resulttrans);
$ress=mysqli_query($conn, "SELECT * FROM transactions");
while($row=mysqli_fetch_array($ress)){
echo "<tr>";
echo "<td>".$row['id']."</td>";
echo "<td>"." same as receiver"."</td>";
$receiver=mysqli_query($conn, "SELECT name FROM users WHERE userid='" . $rowtrans['idreceiver'] . "'");
$receivername = mysqli_fetch_array($receiver);
echo "<td>". $receivername ."</td>";
echo "</tr>";
}
可以与任何后续的兄弟匹配 - 即之后但不是之前。
答案 1 :(得分：1)
:nth-child(i)选择器将解决问题
div.multiple-alerts .cls:nth-child(3) span{ color: yellow; }