css - 如果两个元素都存在于同一级别，则切换规则 - SCSS

Question

我很确定我以前做过这个，但我找不到它或者我的谷歌技能不够。情况是这样的:

.card {
    // ...
    .card-title {
        margin-bottom: $spacer * .25;
    }

    .categories {
        margin-bottom: $spacer * .25;
    }
}

如果任何 .categories 元素存在，如何设置 margin-bottom: 0？

Answer 1

可以考虑:only-child与 :not()选择器如下所示:

.title:not(:only-child) {
  color:red;
}

<div class="container">
  <div class="title">title</div>
  <div class="cat"></div>
  <div class="cat"></div>
  <div class="cat"></div>
</div>

<div class="container">
  <div class="title">title</div>
</div>