Css 更改引导材质主题的颜色

我正在开发一个应用程序，我想使用更深的橙色样式，并试图覆盖sass版本文件中的某些变量，但当我使用gulp编译它时，它不会改变。 另一件奇怪的事情是，当我使用sass版本时，默认颜色是蓝色/靛蓝，但当仅使用githubrepo中的预编译css时，它使用了teal颜色样式。 我的app.scss文件中有以下内容

@import "vendor/bootstrap/_bootstrap";
@import "vendor/bootstrap-material/bootstrap-material-design";
@import "vendor/material/ripples";

我试图通过添加我想要更改的变量（例如链接颜色）来覆盖变量，但没有成功

@import "vendor/bootstrap/_bootstrap";
@import "vendor/bootstrap-material/bootstrap-material-design";
$link-color: $red !default;
@import "vendor/material/ripples";

---

有人知道如何更改主题的整体颜色样式吗？

在更改引导样式/主题时，我发现浏览器的检查器非常有用

• 在Firefox中：工具>Web开发人员>检查器
• 在Safari中：开发>显示Web检查器

---

在页面中选择一个元素，它将按层次顺序显示应用于该元素的所有CSS样式（即正确应用但被另一个优先样式覆盖的样式）。通常，我没有意识到某个元素正在修改某个内容，或者被称为与我想象中不同的内容。

在更改引导样式/主题时，我发现浏览器的检查器非常有用

• 在Firefox中：工具>Web开发人员>检查器
• 在Safari中：开发>显示Web检查器

---

在页面中选择一个元素，它将按层次顺序显示应用于该元素的所有CSS样式（即正确应用但被另一个优先样式覆盖的样式）。通常，某个元素正在被我没有意识到的元素修改，或者被称为与我想象中不同的元素。

为了更改引导变量的默认值，您需要在实际导入引导部分之前定义它们-确保应用！默认标志，因此它不能被覆盖。

为了更改引导变量的默认值，您需要在实际导入引导部分之前定义它们-确保应用！默认标志，因此无法覆盖它。

问题可能是SASS部分应以下划线开头，或者该文件将编译为CSS文件

由于

vendor/bootstrap material/bootstrap material design

不是以下划线开头的，因此在编译CSS时可能没有考虑导入

@import

后定义的变量

---

我还想提到的是，到目前为止（直到下一个支持Bootstrap4的主要版本），项目sass文件是由较少的文件自动生成的。因此，如果使用下划线作为前缀不起作用，您将更幸运地修改较少的文件并编译CSS或生成SASS文件。

问题可能是SASS部分应以下划线开头，或者该文件将编译为CSS文件

由于

vendor/bootstrap material/bootstrap material design

不是以下划线开头的，因此在编译CSS时可能没有考虑导入

@import

后定义的变量

我还想提到的是，到目前为止（直到下一个支持Bootstrap4的主要版本），项目sass文件是由较少的文件自动生成的。因此，如果使用下划线作为前缀不起作用，那么修改较少的文件、编译CSS或生成SASS文件会更好