时间戳

首页 > 解决方案 > Bootstrap 自定义在 Angular 7 中不起作用

angular - Bootstrap 自定义在 Angular 7 中不起作用

问题描述

我正在尝试在 Angular 7 中自定义 bootstrap 4 主题，

我已经安装了引导程序，

在我的角度 .json 我有

 "styles": [
                "./node_modules/@angular/material/prebuilt-themes/deeppurple-amber.css",
                "./node_modules/bootstrap/dist/css/bootstrap.min.css",
                "src/styles.scss"
            ],

style.scss 是我的自定义 scss 类，

里面的style.scss

我试图改变警告主题的颜色

    @import "../node_modules/bootstrap/scss/bootstrap.scss";

   $theme-colors: ( "warning": #0074d9, "danger": #ff4136 );

我有一个带有 btn-warning 类的按钮，我正在尝试更改 btn-warning 颜色。但不工作

style.scss 在我看来正在渲染，但是按钮颜色没有改变。

我做错了什么？

标签： angularbootstrap-4

解决方案

在您的样式数组中，您正在导入 bootstrap.min.css，而在 style.scss 中，您将导入 bootstrap.scss。为什么要导入这两个不同的 css 文件？这两个文件将相互覆盖。

推荐阅读