css样式使用的一个小问题

Question

语法scss

.a {
  background-color :red;
  &.b{
    background-color: green;
  }
  &-c{
    background-color: blue;
  }
  .d{
    background-color: yellow;
  }
}

//我想使用a里面的b c d样式应该如何使用 
//例如使用b样式
//下面哪种方式是对的呐？

<div class="a b">
</div>

<div class="a">
 <div class="b">
 </div>
</div>

<div class="b">
</div>

Answer 1

<div class="a b">
</div>

&意为引用父选择符，如果有这个就代表引用在同一个元素
没有的话

.a {
  .d{
    background-color: yellow;
  }
}

说明a跟d是应用在父子或者祖父、子孙节点的关系

Answer 2

<div class="a b">
</div>

<div class="a-c">
</div>

<div class="a">
    <div class="d">
    </div>
</div>