CSS / LESS选择未包含在给定ID中的元素

Question

假设我有以下HTML结构：

<div id="outer">
   <div id="target">
   </div>
</div>

外部div可能有也可能没有id＆＃34;外部＆＃34;。

我想将样式应用到#target，只有当不包含在id为＆＃34;外部＆＃34;

的div中时

<div id="something-else">
   <div id="target">
   </div>
</div>

有了LESS，我尝试了以下内容：

:not(#outer) {
   #target {
     // styles
   }
}

这显然不起作用（我猜是因为：not运算符不排除其嵌套元素）。

有没有办法用CSS / LESS实现这个目标？当然我知道我可以重构html /逻辑，这样我就可以在不使用的情况下应用样式：not，但我想知道是否有办法实现我所要求的。

Answer 1

试试这个

:not(#outer) > #target {
     // Styles
     background-color: red;
   }
}

您可以尝试一下fiddle。