mergeStyles 不能是父级（按类）的子级（按 id）答案

【问题标题】：mergeStyles can't child (by id) of parent (by class)mergeStyles 不能是父级（按类）的子级（按 id）
【发布时间】：2021-12-18 04:25:59
【问题描述】：

对于以下内容：

<div class="example">
  <div id="label">
    Label text
  </div>
</div>

以下 CSS 可以设置“标签文本”的样式

.example #label {
  color: red;
}

但它不适用于 fluentUI mergeStyles：

const RedLabelStyles = mergeStyles({
  ".example #label": {
    color: "red"
  }
});

我知道这是选择器的问题，而不是 CSS 本身的问题，因为以下正确应用了样式：

const RedLabelStyles = mergeStyles({
  "#label": {
    color: "red"
  }
});

【问题讨论】：

【解决方案1】：

是由于 RedLabelStyles 选择器应用于 <div class="example"> 本身。如果 JSX 如下所示，它将按预期工作：

<div class={RedLabelStyles}>
  <div class="example">
    <div id="label">
      Label text
    </div>
  </div>
</div>

【讨论】：