定义新的CSS颜色名称

定义新的CSS颜色名称,css,sass,less,Css,Sass,Less,我们知道HTML标准定义了一系列颜色,但是我可以在更少的css中定义和使用新颜色吗 比如说我想要一个彩色博士白,我想像这样使用它 背景色:博士白 我知道较少的css可以定义变量并使用at(@)符号。但它看起来不像是本地的颜色 它能在更少的css中实现吗?或者其他CSS预处理器是否支持此功能?您考虑过使用吗 :根目录{ --堆栈溢出:#f69c55; } .矩形{ 宽度:100px; 高度:100px; 利润率:10px自动; } .rectangle.default-color{ 背景色:黑色

我们知道HTML标准定义了一系列颜色,但是我可以在更少的css中定义和使用新颜色吗

比如说我想要一个彩色博士白,我想像这样使用它

背景色:博士白

我知道较少的css可以定义变量并使用at(@)符号。但它看起来不像是本地的颜色

它能在更少的css中实现吗?或者其他CSS预处理器是否支持此功能?

您考虑过使用吗

:根目录{
--堆栈溢出:#f69c55;
}
.矩形{
宽度:100px;
高度:100px;
利润率:10px自动;
}
.rectangle.default-color{
背景色:黑色;
}
.rectangle.custom-color{
背景色:var(--stackoverflow);
}

您考虑过使用吗

:根目录{
--堆栈溢出:#f69c55;
}
.矩形{
宽度:100px;
高度:100px;
利润率:10px自动;
}
.rectangle.default-color{
背景色:黑色;
}
.rectangle.custom-color{
背景色:var(--stackoverflow);
}

在LESS中,如您所说,变量用
@
标记。在Sass中,它们用
$
标记。如果您的DoctorWhite是
#fffff e
,则示例如下:

更少:
@DoctorWhite:#fffff e;div{背景色:@DoctorWhite}

Sass:
$DoctorWhite:#fffff e;div{背景色:$DoctorWhite}

正如@blonfu所说,在手写笔中,它们没有任何标记-因此,如果您的目标是让看到预处理样式表的任何人认为您的自定义颜色名称是标准化颜色名称,那么这可能行得通。(但很难想象用例…)

触笔:

DoctorWhite = #fffffe

put a bunch of other styles here so the viewer doesn't notice you defined DoctorWhite

div
  background-color DoctorWhite
但在所有情况下,您实际上并没有定义一个新的颜色名称,因为HTML有一个颜色
whitemoke
。编译后的CSS(在加载的样式表中显示,在浏览器的检查器中显示)仍将使用您提供的十六进制值
DoctorWhite
——在上述所有示例中,或者如果您使用自定义CSS属性解决方案,CSS将
div{背景色:#fffff e}

在LESS中,如您所说,变量用
@
标记。在Sass中,它们用
$
标记。如果您的DoctorWhite是
#fffff e
,则示例如下:

更少:
@DoctorWhite:#fffff e;div{背景色:@DoctorWhite}

Sass:
$DoctorWhite:#fffff e;div{背景色:$DoctorWhite}

正如@blonfu所说,在手写笔中,它们没有任何标记-因此,如果您的目标是让看到预处理样式表的任何人认为您的自定义颜色名称是标准化颜色名称,那么这可能行得通。(但很难想象用例…)

触笔:

DoctorWhite = #fffffe

put a bunch of other styles here so the viewer doesn't notice you defined DoctorWhite

div
  background-color DoctorWhite
但在所有情况下,您实际上并没有定义一个新的颜色名称,因为HTML有一个颜色
whitemoke
。编译后的CSS(在加载的样式表中显示,在浏览器的检查器中显示)仍将使用您提供的十六进制值
DoctorWhite
——在上述所有示例中,或者如果您使用自定义CSS属性解决方案,CSS将

div{background color:#fffff e}

如果其他人采用了您的代码库,并且错误地认为您的“DoctorWhite”是真实颜色,并试图在其他地方使用它,该怎么办。为了清晰和可维护性,不是最好使用变量作为变量吗?如果你真的想这样做,你可以用类似PostCs的东西来查找/替换这些值。@Sampson我说的是技术可行性。LoveRight,那么是的,这是可能的。像POSTSS这样的工具可以在构建过程中完成这一点。但是,请不要这样做;为了你自己,也为了别人:)一般来说,你应该尽量使用未命名的颜色。@LoveRight你可以使用CSS变量,但并非所有浏览器都支持它们。支持,演示。我认为少一点是不可能的,但你可以定义没有任何符号的变量:
DoctorWhite=#fffee
如果其他人采用了你的代码库,并且错误地认为你的“DoctorWhite”是真的颜色,并试图在其他地方使用它怎么办。为了清晰和可维护性,不是最好使用变量作为变量吗?如果你真的想这样做,你可以用类似PostCs的东西来查找/替换这些值。@Sampson我说的是技术可行性。LoveRight,那么是的,这是可能的。像POSTSS这样的工具可以在构建过程中完成这一点。但是,请不要这样做;为了你自己,也为了别人:)一般来说,你应该尽量使用未命名的颜色。@LoveRight你可以使用CSS变量,但并非所有浏览器都支持它们。支持,演示。我认为用更少的代码是不可能的,但用更少的代码可以定义没有任何符号的变量:
DoctorWhite=#ffee