css - 伪选择器

Question

是否有伪选择器或方法来检测<section>带有 id 的标签。即<section id="no_display">？

我有一个标题，它的底部边距为 35px。但是，我不想在一页上应用下边距，但我想在所有其他页面上应用它。

有没有一种方法可以检测 id 并且不应用边距？

<header>
    //stuff here
</header>
<section id="no_display">
    //other stuff here
</section>

因此，如果<header>紧随其后的是section id="no_display"，则不要应用底部边距

希望这是有道理的。

score 2 · Accepted Answer

您可以使用负边距section来补偿margin-bottom其先前的兄弟元素：

#no_display {
    margin-top: -35px;
}

score 2 · Accepted Answer

您通常不使用伪类来表达两个或多个元素之间的关系；你使用组合器。在这种情况下，您需要一个前同级组合器。不幸的是，那不存在。

确实存在的是跟随兄弟组合器。由于您真的只希望边距在section没有该 ID 的情况下存在，因此您可以将底部边距打开header为顶部边距 on section，并在它确实具有 ID 时使用覆盖规则以从中删除边距：

header + section {
    margin-top: 35px;
}

header + section#no_display {
    margin-top: 0;
}

（你真的不需要像这样的选择器，header + section#no_display因为 ID 本身就足够具体了，但这样做有助于我一眼看出第二条规则与第一条规则相关。）

2 回答 2