php - CSS 为列表中的最后一个子项设置样式

Question

我有一个由 php 从 sql 表生成的列表，我正在尝试将一些 css 添加到最后一个 <li>但它会影响所有 <li>的。 有什么我不明白的地方或者我的代码中有什么特别之处吗？

php:

echo "<ul>";
        if($row['sender'] == $userid) {
            echo "<li class='bubble' style='background: #4cd964;'><p>" . $text . "</p></li>";
        } else {
            echo "<li class='bubble' style='background: #ffcc00;'><p>" . $text . "</p></li>";
        }
        echo "</ul>";

CSS:

.bubble {
    position: relative;
    margin-bottom: 50px;
    left: 45%;
    width:100px;
    height:100px;
    border-radius:50%;
}
.bubble:last-child {
    margin-bottom: 20%;
}

Answer 1

您的 PHP 代码仅输出一行，一行以 #4cd964 或 #ffcc00 作为背景颜色的 LI。我没有看到任何迭代结构来输出更多行。如果您的迭代在 <UL>...</UL> 之外 block ，那么您将输出与迭代一样多的列表...这意味着 :last-child 适用于您页面上的每个 LI。

请发布完整的 PHP 代码。