LessCss和css导入

时间:2011-03-24 10:19:29

标签: javascript css less

我正在尝试将LessCSS(版本1.0.41)与Blueprint集成,但似乎我无法在少量样式表中导入css文件。所以我尝试了一个更简单的导入:

.red { color: red; }

并将其放入test.css中。然后,在less_test.css中:

@import "test.css":

.test { .red; background-color: pink; }

但LessCSS抱怨说.red没有定义。我错过了什么? 如果我在test.less中重命名test.css(并将其导入为“test”),一切运行正常。但更改蓝图文件扩展名并将其用作screen.less,print.less和ie.less是否安全?

2 个答案:

答案 0 :(得分:3)

  

作为CSS的扩展,LESS不仅向后兼容CSS,而且它添加的额外功能使用现有的CSS语法。[1]

这意味着任何有效的CSS文件也是有效的LESS文件,因此您可以安全地将.css文件重命名为.less,并且您不应该遇到任何问题。

[1] http://lesscss.org/#docs

答案 1 :(得分:0)

过去我遇到了同样的问题。事实证明这是一个简单的解决方法。

我试图使用@import加载BlueprintCSS screen.css文件,我在screen.css文件中做了一个内联注释,并将/ ** /之间留在花括号中。

错误代码:

.class { margin-top: 12px /*24px*/; }

事实证明,花括号里面的注释会导致LessCSS编译器吓坏并停止处理文件。省去了其他所需的选择器以用作mixins。

我会看看你导入的文件是否导致错误并且没有完成编译。