基于父 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>

我需要做的是，当我将“card-content”类更改为“stripe-card-content”时，需要将一些引导类添加到内部 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 会动态构建列，因此可能会更加棘手。当您尝试在行上扩展时，让我研究一下。