CSSTYLE - 选项不覆盖标准值

Question

我有这个代码：

@include component(elementList) {
  tr {
    td {
      width: 50%;
      background: $darkGray;
      padding: 5px;
      text-align: center;
    }
    @include option(heading) {
        padding: 5px;
        background: #eeeeee;
        text-align: center;
        font-family: 'Quicksand', sans-serif;
    }
  }
}

只是一个table。每行都应该有一个深色背景（保存在 $darkGray 中），除了那些设置了选项 --heading 的行。那些应该有一个明亮的背景。

但是在我的浏览器中，所有行都是深色的。我还在选项中尝试了 !important。

有什么想法吗？

谢谢大家

PS：我正在使用 CSStyle 和 SASS。

Answer 1

认为这是一个范围界定问题。您在 table 个单元格上使用深色背景，而在行上使用亮背景。所以无论该行有哪个选项，其包含的单元格都是黑色的。

这应该可行（未经测试且从未使用过 CSStyle）

@include component(elementList) {
  tr {
    td {
      width: 50%;
      background: $darkGray;
      padding: 5px;
      text-align: center;
    }
    @include option(heading) {
      td {
        padding: 5px;
        background: #eeeeee;
        text-align: center;
        font-family: 'Quicksand', sans-serif;
      }
    }
  }
}

CSSTYLE - 选项不覆盖标准值

CSSTYLE - option does not override standard values

css

sass