Html 基于条件的CSS选择器

我正在尝试让CSS选择器检查并应用CSS，条件是：如果：

sectionContent-noToolbar

可用，则在

sectionseparator

上应用

height:2em

。是否可以使用一些选择器来实现这一点？我一直在寻找一个答案已经有很长一段时间了，没有任何运气。有什么建议吗

<section class="sec" name="Information">
    <div class="sectionContent-noToolbar"></div>
</section>
<div class="sectionSeparator"></div>

不，它不是

如果是兄弟姐妹，则可以使用相邻兄弟姐妹组合器：

.sectionContent-noToolbar + .sectionSeperator {
    height: 2em;
}

…但是CSS没有允许您根据元素的同级子元素修改元素的功能
 正如另一个答案所述，没有办法做到这一点。为了达到您希望达到的效果，您需要重新考虑您的实施。这是因为CSS的核心不是一种经过处理的语言，因此不能处理条件语句

在重新思考时，您可能会研究CSS预处理器，例如或，它们试图在CSS中实现逻辑结构。
CSS帮不了您。您可以使用javascript实现这一点，因为它可以在DOM中遍历。jQuery对于这项任务来说是相当整洁的。只需使用css选择器和遍历函数（如
parents
）选择所需的节点，
同级
或子级`并手动修改找到的元素的样式。
CSS中不存在常规“可用”条件。您无法使用CSS应用，因为还没有父选择器。同意，但是否有其他方法。错误。。。这一切都意味着这是不可能实现的，也许你在构建网站时应该牢记这一点。CSS只向前和向下工作，没有其他方向。如果您向父级提供类sectionContent NOTOLBAR，您可以这样做。sectionContent NOTOLBAR+。sectionSeparator{}（同级选择器）SASS和更小的SASS在这里将不起作用-它们受相同规则的约束，因为它们必须输出相同的语言：CSS。问题的标题是：“基于条件的CSS选择器”。SASS和LESS肯定会解决这个问题。@Joshua Cook:如果CSS不能充分解决这个问题，任何预处理器也不会，因为正如这里所说的，它们都可以归结为CSS。我怀疑它们的意思不是说“它们不会有任何影响”，而是说“它们不会有什么不同”，因为这最终取决于CSS的功能。这些条件与html无关，输出仍然是CSS，这不允许像这样进行条件选择：
body.classExists？body.class{apply this；}:body.otherClass{apply other；}
。SASS和更少的工作，但他们的最终结果就像手写的CSS。你的回答意味着你推荐的工具可以解决问题，但他们不能，所以你给了OP一个大的红鲱鱼。这只能通过更改DOM（使用不同的HTML或JavaScript）来实现。（您的答案的其余部分也是错误的，类似的条件可以用CSS表示，这些条件不能涉及回溯DOM树）。具体来说，CSS中没有父选择器。至少对于选择器语法的典型解释是这样的。选择器-4使这在理论上成为可能，即使在该规范中也找不到“父选择器”（特别是指定父对象而非子对象作为主题的子组合符的对应项）。@Something here:主要是实现问题，它们是。与级联无关（虽然在那个时候我只是学究气…），BoltClock是对的，它与级联无关。它仅确定将哪些顺序规则应用于中的给定元素。实现问题首先是匹配元素的成本。事实上——尽管我开始认为，试图解释级联在选择器上下文中的真正含义（也就是说，什么都没有）是：(