Question

我将以下HTML与一些PHP结合使用：

echo "<a href='" . $_SERVER["PHP_SELF"] . "?guess=" . $value . "' class='already-guessed'>" . $value . "</a>\n";

如果已经猜到了它，它会应用一个特殊的类，正如类所暗示的那样。如果没有猜到，我就有了这个：

echo "<a href='" . $_SERVER["PHP_SELF"] . "?guess=" . $value . "'>" . $value . "</a>\n";

这是相关的CSS：

.letters a {
    display: inline-block;
    width: 40px;
    height: 40px;
    margin: 0 3px 6px 0;

    background: #5ac9ff;
    color: #fff;
    line-height: 2.5em;
    text-align: center;
    text-decoration: none;
}

    .letters a:nth-child(10n) {
        margin: 0 0 8px 0;
    }

    .letters a:hover {
        background: #54bff3;
    }

    .letters a:active {
        background: #4fb4e4;
    }

.already-guessed {
    background: green;
}

所以我只是让它检测到所有锚点。

Answer 1

锚点的选择器优先。更改.already-guessed类的代码，如下所示：

.already-guessed {
    background: green !important;
}

或者，如果您愿意，请更新选择器：

.letters a.already-guessed {
    background: green;
}

为什么我的CSS不会在这里发生变化？

1 个答案: