Question

我正在尝试遵循michael hartl教程，我正在尝试使用sass在css中实现变量，将颜色名称从＃999更改为$ black

所以这是我从bootstrap custom.css.scss

中提取的示例代码

$black: #999;

我保存，我关闭，我改变，我得到的是

h2 {
   color: #999;
}

这应该是这样的吗？我需要手动改变一切吗？目的不是自动改变一切吗？

编辑1：我认为会做什么：

$black: #999;

h2{
   color: black
}

基本上自动从HEX代码更改为变量名称。

Answer 1

CSS（目前）不支持这样的变量，所以当scss被编译成css时它确实是替代

所以如果你的scss文件是这样的

$black: #999
h2 {
    color: $black;
}

css输出将是

h2 {
    color: #999;
}

Answer 2

$black: #999;

h2{
   color: $black;
}

Answer 3

你要问的是什么并不完全清楚......

如果您定义一个变量，例如

$black: #999

你可以使用，你希望color应用。

所以如果你定义

h2 {    
   color:$black;    
}

在您的SCSS文件中

将输出

h2 {
    color:#999;
}

生成的 CSS文件中的

。

如果您决定稍后更改颜色，则可以更改SCSS文件中的$black，它将迭代到新生成的 css文件。

使用SCSS，你应该从不需要编辑CSS文件。

哦，最后一件事......你真的不应该为变量使用实际的颜色名称。你应该使用像$my_dark_color这样更通用的东西，因为有时候$ black`可能会变成一个非常深蓝色的东西。