是否可以在SASS中为某种元素类型的父母设置样式？

Question

我想这样做：

.classname {
  color: red

  a& {
    color: blue;
  }
}

并将其编译为：

.classname {
   color: red;
}

a.classname {
   color: blue;
}

是否有可用的语法来支持此功能？我尝试过使用a&，#{a&}和指南针函数#{append-selector("a", "&")}，但它们不会编译，a &会这样做，但显然会在a .classname中产生结果比a.classname。

Answer 1

我尝试过各种可以让你这样做的选项，但我只能回来“为什么”？什么是用例，为什么你需要这样做而不是其它能达到与你想要的结果相同的结果。

Answer 2

我无法找到标签的解决方案，但在这种特定情况下，您可以使用&[href]。它速度较慢但实际上更精确（某些<a>标签可能不是链接。）

希望很快我们就可以使用&:any-link（What's the :any-link pseudo-class for?），但浏览器还不支持

Answer 3

对于SASS的嵌套语法，这实际上是不可能的。来自SASS reference：

  

内部规则只适用于外部规则的选择器。

嵌套规则是语法糖，使CSS descendent selectors更易于编写，因为它们是最常见的CSS结构之一。虽然使用您的方法编写这种规则很好，但这不是设计（或定义）语法的方法。