布尔玛卡内容变色答案

【问题标题】：Bulma card content change color布尔玛卡内容变色
【发布时间】：2019-01-11 12:01:32
【问题描述】：

我遇到了一个小问题。我想更改卡片内容的背景。但没有任何效果。我有这个代码部分：

<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;
}

【问题讨论】：

请添加您的所有相关代码。

标签： css bulma

【解决方案1】：

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

或

您可以向card 类添加新样式并设置background-color 属性。

.card {
    background-color: green;
}

【讨论】：

【解决方案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>

【讨论】：