使用react-bootstrap自定义卡片背景。

Question

我想自定义react-bootstrapcards的bg道具，也就是使用一些不同于默认的primary、secondary、danger等变体的东西。根据文档，可以通过提供一个带有'card-'bsprefix的自定义道具来实现，但我似乎无法做到这一点。

我现在的代码是这样的。

    <Card bg="light-blue">
       <Card.Body >
          <Card.Text >
            foobar
           </Card.Text>
        </Card.Body>
    </Card>

在一个.css文件中，我定义了以下样式：

.card-light-blue {
  background-color: rgb(147, 182, 248);
}

应该怎么改才行？

Answer 1

试着给卡片一个className，然后用这个类给它一个背景色。如果单单这样还不行，可以尝试添加 !importance

<Card className=“customCard”></Card>

.customCard: {
    background: blue !important;
}

在你的例子中，你并没有给卡片一个浅蓝色的类，你试图给它分配一个背景。