覆盖Materialise CSS属性

Question

我已经包含第一个 Materialise的CSS和然后我已经链接了我的css文件。

我在其中有一个示例类，它将background-color属性设置为red，但是它不会覆盖默认颜色（由materialize-css设置）。 / p>

以下是一个例子： https://jsfiddle.net/79ss2eyr/1/

我不想更改实体化源文件中的任何内容，而是想添加其他类并设置其他颜色。

以下是检查员的说法：

我应该怎么做以及为什么我的css属性不会覆盖实体化，因为它在>框架之后链接？

Answer 1

使css选择器更具体，如下所示：

footer.app-bg {
  background-color: red;
}

Answer 2

Inn Materialise的规则由footer.page-footer {}设置，但您只是写了.app-bg。因此，您无法覆盖Materialise的规则。

如果您想覆盖该课程，可以使用footer.app-bg或使用!important：

footer.app-bg {
  background-color: red;
}

或

.app-bg {
  background-color: red !important;
}

Answer 3

如果您的css因为其他已应用的css而未应用于该元素，请使用!important指定您的CSS很重要。

.app-bg {
  background-color: red !important;
}

示例：https://jsfiddle.net/79ss2eyr/2/