css - 类中 html 元素的 sass ＆符号(&)

Question

这个问题在这里已经有了答案:





How do I reference the parent selector at the end? [duplicate]

(2 个回答)


6年前关闭。
社区在2个月前审查了是否重新打开这个问题并关闭了它:

原始关闭原因未解决





这相当简单:

h2{
    color:blue;
    &.someClass{
         color: red;
      }
   } 
//output:
   h2{color:blue;}, h2.someClass{color: red;}

但是当我尝试相反的方法时，它不起作用:

 .someClass{
        color: red;
        h2&{
            color:blue;
        }
    }
//error: invalid selector after h2

//what I want to get: 
  h2.someClass{color:blue;}, .someClass{color: red;}

显然，这些是行不通的:
&h2 -> .someClassh2 ,
& h2 -> .someClass h2 ,
h2 & -> h2 .someClass
任何解决方案？

Answer 1

CSS 不是这样工作的。 & 符号只是将标签和类串在一起形成可读的 CSS。也许他们最终会在 Sass 规范中添加一些东西来完成这项工作，但现在 & 号只是被你嵌套中最接近的父代替换了。