基于父 div 类添加引导类 - 首选仅 SASS 解决方案

Question

我的div结构如下，我的项目使用Angular2运行。

<div class="card-content">
  <div>
    <h4 class="card-title">
         <a href="#pablo">Cinnamon Lodge - Habarana</a>
    </h4>
    <div class="card-description color-overwrite">Double Room</div>
  </div>
</div>

我需要做的是，当我将"卡片内容"类更改为"条纹卡内容"时，需要将一些引导类添加到内部div 中，如下所示。

使用打字稿，我可以将类更改为"条纹卡内容"。但我更喜欢仅 SASS 的解决方案来添加基于父div 类的引导类。有什么帮助吗？

<div class="stripe-card-content">
  <div class = "row">
    <h4 class="card-title col-lg-6">
         <a href="#pablo">Cinnamon Lodge - Habarana</a>
    </h4>
    <div class="card-description color-overwrite col-lg-6">Double Room</div>
  </div>
</div>

Answer 1

加载适当的导入后，您可以扩展 Bootstrap 类，如下所示：

.stripe-card-content {
    > div {
       @extend .row;
    }
}

但是，如果我没记错的话，Bootstrap 会动态构建 cols，因此可能会更棘手。 当您尝试在该行扩展时，让我研究一下它。