布尔玛卡内容改变颜色

Question

我运行陷入了一点问题。我想更改卡片内容的背景。但没有任何效果。我有这个代码部分：

<div class="card" style="width: 75%!important;">
....
  <div class="card-content">
    <div class="content">
....
    </div>
  </div>
</div>

css

.card .content {
  background: rgba(255, 255, 255, 0.5)!important;
}

Answer 1

如果您在 bulma 项目中使用 sass，您可以更改变量 $card-color 和 $card-background-color。 https://bulma.io/documentation/components/card/

或

您可以在 card class 中添加新样式并设置 background-color 属性。

.card {
    background-color: green;
}

Answer 2

或者您可以使用预定义的背景颜色类例如 has-background-light

https://bulma.io/documentation/helpers/color-helpers/#background-color

<div class="card has-background-light" style="width: 75%!important;">
....
  <div class="card-content">
    <div class="content">
....
    </div>
  </div>
</div>

布尔玛卡内容改变颜色

Bulma card content change color

css

bulma