减少CSS导入问题

我在这里处理更少的CSS。一切都很顺利，但我现在有点不舒服。 我少了两个文件。第一个叫做“colors.less”，我在其中声明了颜色变量，第二个是css结构

是这样的：

<link rel="stylesheet/less" type="text/css" href="less/styles.less"/>
<link rel="stylesheet/less" type="text/css" href="less/color.less"/>

颜色。较少

@black: #000;

@import "color";

body {
    background: @black;
}

样式。较少

@black: #000;

@import "color";

body {
    background: @black;
}

在我的头标签上，我写下：

<link rel="stylesheet/less" type="text/css" href="less/styles.less"/>

当然，导入更少的js

当我把黑色改成白色时，它就不会变成白色。仍然是黑色的。当我颠倒逻辑，导入颜色中的样式时，它会改变，但我的样式不会改变

我做错了什么

---

谢谢大家

您是否可以在主

样式表中使用
颜色
，而不引用第二张
样式表

然后您可以跳过
@导入

另外，我会为样式
规则
选择另一个名称。如果您决定更改颜色，您的规则名称将毫无意义。
我不知道是什么原因导致了这种情况，但请尝试在yout
-标记中引用这两个文件，如下所示：

<link rel="stylesheet/less" type="text/css" href="less/styles.less"/>
<link rel="stylesheet/less" type="text/css" href="less/color.less"/>



然后还可以将
style.less
更改为不导入
color.less
，因为您已经在
-标记中这样做了

顺便说一句：我不会将颜色称为黑色，这可能会在以后更改颜色时导致混淆，请尝试使用更多描述性名称，如
@mainBackgoundColor
，以获得可读性良好的代码。
使用

@import "color.less";

这可能会解决你的问题。如果这不能解决问题，请尝试在您的颜色中使用红色。如果您的浏览器默认颜色为黑色，您将看不到样式是否已加载

PS：检查文件名，如color.less或colorS.less。
导入的任何文件都必须具有.css扩展名。只有包含或检索的文件才能具有.less扩展名

在您的示例中，颜色文件的扩展名应该是.css，而不是.less。这会让你很快康复的

**更新
在Chrome中工作，而不是在Firefox中
?? 奇怪
 LESS使用css语法，因此您需要文件扩展名：

@import "color.less";

我使用较少，因为我需要动态的风格。用户将在admin上设置颜色，这些颜色将保存在color.less文件中。关于规则名称，我试过了，我换了一个名称，但也没用。@Lucas：另一个想法：尝试使用
@import./color.less”
（或者
“/color”
，如果您愿意的话），我一分钟前刚刚用它导入了某个文件，它工作得非常完美，当您更新一个导入的文件时，也要更新导入的文件（只需在某处添加一个空格或某个文件），我想less可能在后台做一些缓存或其他事情。结尾应该有一个分号，但我只是很挑剔。你也可以
@import“color.css”