覆盖物化 CSS 属性答案

【问题标题】：Override Materialize CSS properties覆盖物化 CSS 属性
【发布时间】：2023-11-15 05:58:02
【问题描述】：

我已经包含了首先 Materialize 的 CSS，然后我已经链接了我的 css 文件。

我有一个示例类将background-color 属性设置为red，但这不会覆盖默认颜色（由materialize-css 设置）。

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

检查员是这样说的：

我应该怎么做？为什么我的 css 属性没有覆盖 materialize 的，因为它是在框架之后链接的？

【问题讨论】：

【解决方案1】：

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

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

【讨论】：

【解决方案2】：

Inn Materialize 的规则是由footer.page-footer {} 设置的，但你写的只是.app-bg。所以你不能覆盖 Materialize 的规则。

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

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

或

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

【讨论】：

【解决方案3】：

如果您的 css 由于其他应用的 css 而未应用到元素，只需使用 !important 指定您的 css 很重要。

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

【讨论】：