跨度中的 scss 类选择器答案

【问题标题】：scss class selector in span跨度中的 scss 类选择器
【发布时间】：2017-12-23 01:00:17
【问题描述】：

我觉得问这个问题很愚蠢，因为我觉得我错过了一些东西。我有以下 HTML 代码：

<span class="label-link-text">[help]</span>

现在，我想使用类选择器设置 span 的样式，如下所示：

span {
  .label-link-text {
    font-size: 15pt;
    color: red;
  }
}

很遗憾，它不是那样工作的。但相反，这工作正常：

span {
  &[class="label-link-text"] {
    font-size: 15pt;
    color: red;
  }
}

谁能给我解释一下？我认为类选择器应该像第一个示例那样工作？

非常感谢！

【问题讨论】：

【解决方案1】：

这样做：

span {
    .class {}
}

使用类class 作为跨度子级的目标元素：

<span><div class="class"></div></span>

你想要的是这个：

span {
    &.class {}
}

通过使用& 父选择器，您可以将spans 定位为class 类：

<span class="class"></span>

【讨论】：

【解决方案2】：

使用这个

span {
  &.label-link-text {
    font-size: 15pt;
    color: red;
  }
}

【讨论】：