引导卡标题背景颜色错误

Question

这可能没什么大不了的，但是我无法弄清楚。.我正在尝试更改引导卡头的背景颜色，但是当我添加background-color: #00AA9E它时，似乎以某种方式破坏了头的外观。 ？有人看过吗？它与卡的嵌套有关吗？它是引导程序中的错误吗？

之前 background-color: #00AA9E

后 background-color: #00AA9E

Answer 1

首先，由于将字体颜色设置为白色，因此只需使用text-white该类。

但是，无论何时使用以下代码，我都不会遇到相同的问题：

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet"/>
<div class="container">
  <div class="card">
    <div class="card-header text-white" style="background-color: #00AA9E;">
      Featured
    </div>
    <div class="card-body">
      <h4 class="card-title">Special title treatment</h4>
      <p class="card-text">With supporting text below as a natural lead-in to additional content.</p>
      <a href="#" class="btn btn-primary">Go somewhere</a>
    </div>
  </div>
</div>

还有其他事情可能会影响您没有向我们展示的风格吗？

Answer 2

找到了修复方法，我将卡的（不是卡头）设置background-color为#00AA9E，然后将卡体设置为白色。可能不是正确的方法，但它为我完成了工作。:)