类样式取决于嵌套 SCSS/& 符号的元素（h2/h3）？

Question

我觉得我在这里遗漏了一些非常明显的东西，我可以为它编写 CSS，但我想知道是否有办法使用嵌套的 SCSS。如果您在一个类上有样式，如果该类在不同的元素上，是否可以调整样式。例如h2，然后是h3。我知道你可以通过额外的课程来做到这一点，比如......

.title-class {
    background-size: 30px;
    font-size: 30px;

    &.another-class {
        background-size: 20px;
        font-size: 20px;
    }
}

这将呈现为.title-class.another-class {}

我追求的是.title-class {} 的基类和h3.title-class {} 的嵌套样式 - 有可能吗？

我认为类似以下（理论上）显然行不通！我尝试使用@root，但我对此的了解很少，所以我无法让它发挥作用。

.title-class {
    background-size: 30px;
    font-size: 30px;

    &h3 {
        background-size: 20px;
        font-size: 20px;
    }
}

提前致谢！

Answer 1

如果您尝试使用 title-class 类定位所有 h3 元素，不使用 @root 指令，您将使用以下内容：

h3 {
  &.title-class {
    color: blue
  }
}

如果您想使用 root 指令，请查看this already answered question，尽管我个人觉得在这种情况下它有点过于复杂。