Question

所以我今晚发现的bootstrap中的custom.scss文件有点奇怪，我想知道我是否遗漏了一些东西。假设我将颜色$ blue设置为自定义值（在这种情况下为＃000只是为了使其易于阅读）并删除_custom.scss中的！default标志，因为我应该这样做。在_variables.scss文件中，颜色$ brand-primary设置为$ blue，带有！default标志。然后，$ btn-primary-bg设置为$ brand-primary，也带有！default标志。所以，我的想法是，如果我设置：

$blue: #000000;

在custom.scss文件中，它应该使用$ blue级联到任何变量，使其成为：

$brand-primary: $blue; set to #000 and then
$btn-primary-bg: $brand-primary; also set to #000000

好吧，事实证明我必须在自定义sass文件中列出所有这3个实例，并在它们更改为自定义颜色之前删除它们的！default标志。

因此，而不是我的自定义工作表只有一行

$blue: #000000;

它需要

$blue: #000000 ;
$brand-primary:  $blue;
$btn-primary-bg: $brand-primary;

之前，自定义颜色应用于这些类。

我在这里遗漏了什么吗？我们不应该只设置一次自定义颜色，然后引用它的任何变量也会引用该自定义颜色吗？对我来说似乎效率低下。

Answer 1

[在此处输入链接描述] [1]已定义变量没有问题。您可能需要更改在HTML中使用它们的方式。请看下面根据您定义的变量提供的示例。我建议删除＆＃34; $ blue＆＃34;变量并直接为＆＃34; $ brand-primary＆＃34;定义颜色。可变！

[1]: https://jsfiddle.net/negin/t36ep4e8/

Bootstrap 4自定义变量不会级联下来吗？

1 个答案: