Question

是否可以在HTML中声明LESS变量，并在单独的.less文件中使用声明的变量。

我想做这样的事情：

<html>
<head>

<style type="text/less">
  @MYVAR: #9BC509;
</style>

<!-- use MYVAR inside the main.less file -->
<link rel="stylesheet/less" type="text/css" href="styles/less/main.less">

</head>
...
</html>

修改

由于这不起作用并且不是一个干净的解决方案，我重新构建了我的项目，现在为我需要的变量做一个正常的文件@incude。 django模板引擎使用数据库值动态地将较少的文件写入光盘（以获得更好的性能）。

致所有的挫折者。我真的不明白你的观点！你甚至没有写下为什么你贬低了。我的情况是你没有得到我的目标，这是我应该要求“缓慢思考者”的问题：

如何实现包含<head></head>中声明的较少变量，以便在单独的较少文件中可用？但无论如何，这只是让人们在某个时候点击这篇文章......正如我所说，我选择了另一种解决方案。

Answer 1

您可以通过在全局globalVars对象的less属性中定义变量来实现此目的。您应该在调用less.js编译器之前声明less对象，另请参阅：http://lesscss.org/usage/#using-less-in-the-browser

<link rel="stylesheet/less" type="text/css" href="global.less">
<script>
    var less = {
    globalVars: {
      color: 'red',
      width: '15px'
    }
    }
</script>
<script src="js/less.min.js" type="text/javascript"></script>

通过上述内容，您可以在Global.less的Less代码中使用@color和@width。

Answer 2

你做不到。你可以做的是给你的（或任何其他高级容器）一个类名，然后根据它定义多个值：

.home {
  @MYVAR: #9BC509;
}

.page {
  @MYVAR: #fff;
}

或使用LESS警卫（见LESS docs）

是否可以在HTML中声明LESS变量？

2 个答案: