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:我在 SASS 中使用 CSStyle。

Answer 1

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

这应该可以工作(未经测试且从未使用过 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;
      }
    }
  }
}