css和/或SASS +（兄弟）选择器向上

Question

在CSS中，如果兄弟姐妹在输出中位于上方，则无法选择带加号的兄弟姐妹，这是html中的前一个元素。

例如

<div class="first">
<div class="second">

.second + .first { style applied to div.first}

在SASS / SCSS中有没有这样做？

Answer 1

SASS支持所有CSS3选择器。兄弟姐妹+就是其中之一。但它没有带来一些额外的功能。 这意味着你可以做到

first {
  + second { 
     font-size: smaller;
  }
}

但你不能用它影响父母......

Ps：它似乎是CSS4的一个特点：）

Answer 2

我知道这种感觉，这真的很烦人。我发现了一个快速的方法。

HTML：

<div class="mainmenu">
  <div class="subnav">
    <ul>
      <li>Whatever</li>
    </ul>
  </div>
</div>

--------＆GT;

SCSS：

  

// CSS指向div的第一个孩子＆＃34; mainmenu＆＃34;随着   class＆＃34; subnav＆＃34;。

 .mainmenu{
      & > .subnav{
        // Child Selector SCSS HERE
      }
    }

====＆GT; thgaskell，你证明我错了:)我的代码工作正常，我丢失了6KB的Minified代码！我已将代码更新为以下评论的通知。

Answer 3

可能或可能不适合您的需求，但您可以使用Sass / CSS中的常规兄弟选择器。这将选择同一节点级别上的所有元素（之前没有明确说明但仍然很方便）：

.second {
   .first ~ & {
       /* styles to be applied to .second if a .first exists at the same node level */   
   }
}

Answer 4

我最终使用了Jquery。完成工作:) （对不起，我不再有示例代码，因为我去了另一条路线，但它非常简单， 像'如果孩子有课，那么添加课程'。 ：）

Answer 5

div { & + & { margin-left: 15px; background: firebrick;}}

尝试它的工作。