如何在CSS中使用Less变量

Question

好的，所以我不是新手使用Bootstrap，但我是新手来定制它并使用LESS变量。我正在尝试做最简单的事情，只是为了检查LESS变量是否正常工作。

我试图将身体的背景颜色设置为@ brand-success，以便进行测试。它不起作用。 Chrome告诉我这是一个无效的属性值。

我知道我之前在jQuery中使用过Bootstrap的LESS变量，但我认为CSS文件的工作方式相同。

我不确定它是否有任何区别但是我在本地使用bootstrap.css文件而不是像我执行jQuery文件那样从外部服务器链接它。

我不知道这是否是重复的问题。我尽力寻找答案，但问题看起来都与我的不同。

Answer 1

较少的是CSS 预处理器。您可以在Less中使用纯CSS，因此CSS 更少，但反之则不然。 Chrome不知道Less是什么。它只解释CSS。 @brand-sucess不是有效的CSS。

它可能在PHP中有效，因为在将CSS文件发送到客户端之前，您的PHP应用程序可能先前运行了较少的预处理器。

如果您使用的是客户端较少的预处理器，它可能在JQuery中有效。在这种情况下，您可以直接向客户端发送LESS，但首先必须将其转换为真正的CSS颜色（例如：＃58fe23），然后Chrome才能对其执行任何操作。