CSS 高级选择器 - 可能吗？ [复制]答案

【问题标题】：CSS advance selector - is posible? [duplicate]CSS 高级选择器 - 可能吗？ [复制]
【发布时间】：2018-01-05 01:23:09
【问题描述】：

我对 CSS 选择器有疑问。我有以下结构 - 我只能修改 CSS - 我无权修改 html 或 JS。

 <div class="wrapper">
  <div>
    <div>
      <div class="open">

      </div>
    </div>
  </div>
  <div>
    <div class="top">

    </div>
  </div>
</div>

类打开将被切换。我可以在以下情况下制作选择器：

4 行中的 div 已打开 - div 类 top => .top {top:50px}
4 行中的 div 没有打开 - div 类 top => .top{top:0px;}

这可能吗？

【问题讨论】：

使用 CSS 并非不可能，获得当前排名
如果您可以将open 类添加到.wrapper 内的最外层父级，则将成为可能。
@MohammadUsman - 你说得对，但不幸的是我只能编辑 CSS。
在那种情况下，在纯 CSS 中是不可能的（直到 CSS 设法为我们提供了一个可行的父选择器）。
根据定义，CSS 向下级联，没有办法返回树上找到父元素的兄弟姐妹，这在这种情况下是必需的。我建议您重新考虑您的流程，您是否可以向wrapper 应用一个影响两个子类的类？

标签： css css-selectors

【解决方案1】：

试试这个：

.wrapper div:not(.open){
    ...
}

您需要调整它以获取正确的 DIV，因为这会影响 .wrapper 中的所有它们

在您的情况下，您似乎需要以下内容：

.wrapper > div > div > div:not(...){...}

但是，这是一种不好的做法。

您可以在这里阅读更多内容： https://developer.mozilla.org/en-US/docs/Web/CSS/:not

【讨论】：

这不是我需要的:)
对不起伙计，这是我从问题中了解到的。