Css Sass：使用多个嵌套选择器选择父元素

以下是我最终要做的：

.books, .dvds, .magazines {
  article &.books {
    /* Wanting the selector to only be ".books article" */
  }
  article {
    /* Can apply to any of the `article` tags under .books, .dvds and .magazines */
  }
}

我有一些嵌套的选择器，我想保持它们嵌套，而不是生成一个新的

.books文章

选择器，但仍然只针对

.books

下的

文章

元素

我确实尝试过这个方法，效果不错，但输出是

.books.books article

，这是多余的，让我感到畏缩：

.books, .dvds, .magazines {
    &.books article {
        /* Outputs ".books.books article, .dvds.books article, .magazines.books article"...boooo, hisssss */
    }
}

---

那么更像是：

article {

  .books &,
  .dvds &,
  .magazines & {
    /* book, dvd, magazine shared stuff */
  }

  .books & {
    /* book stuff */
  }

}

汇编至：

.books article, .dvds article, .magazines article {
  /* book, dvd, magazine shared stuff */
}
.books article {
  /* book stuff */
}

---

你能告诉我为什么要使用&.books和SASS，在嵌套时使用

&

选择父选择器。我从来不理解嵌套语法。那会输出

.books.books文章

而不是

.books.books文章、.dvd.books文章、.magazies.books文章

？@BoltClock-Bah，你说得对。所以，更糟糕的是就我所知，你想要达到的目标是不可能的。此外，我建议将其分解为两个嵌套的代码位，而不是试图将其全部保存在一个代码位中，这样更易于阅读和维护（并占用同样多的代码行）！这本书值得一看，让更多的人都能看到