作者:手机用户2502894791 | 来源:互联网 | 2023-01-13 13:28
我有一个主要的styles.scss像这样:
//@import "../components/bootstrap/scss/bootstrap";
// Core variables and mixins
@import "../components/bootstrap/scss/functions";
@import "../components/bootstrap/scss/mixins";
@import "components/variables";
@import "../components/bootstrap/scss/variables";
我尝试在我components/variables
这样覆盖成功变量:
$green: #71c835 !important;
但它一直拿起引导的颜色variables.scss
是
$green: #28a745 !default;
为了创建一个清晰的视图,我已经尝试过切换这两个文件的顺序,如下所示:
// Core variables and mixins
@import "../components/bootstrap/scss/functions";
@import "../components/bootstrap/scss/mixins";
@import "../components/bootstrap/scss/variables";
@import "components/variables";
它真的让我发疯,我怎么能简单地覆盖引导变量
1> Quentin..:
$green: #71c835 !important;
表示将绿色变量的值设置为此十六进制代码,然后设置为important.
它并不意味着将绿色变量的值设置为此十六进制代码,并忽略后续尝试更改该值.
您无法阻止变量被更改.
您必须按正确的顺序编写代码.
如果要覆盖../components/bootstrap/scss/variables
,components/variables
则components/variables
在另一个之后导入.