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

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

我想做这样的事情：

<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>中声明的更少变量以在单独的 less 文件中可用？但无论如何，这只是为了在某个时候击中这篇文章的人......正如我所说，我选择了另一种解决方案。

您可以通过

在全局less对象的 globalVars 属性中定义变量来执行此操作。在调用 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。

您可以在 less.js 脚本标签上定义它们，如下所示：

<script src="/js/less.js" data-global-vars='{ "color1": "#333" }' rel="stylesheet/less"></script>

因此，对于 php，您可以执行以下操作：

<script src="/less.js" data-global-vars='<?php 
      echo json_encode([
                       'color1' => '#F0CF5B',
                ])
?>' rel="stylesheet/less"></script>

你不能

。您可以做的是为您的（或任何其他高级容器）提供一个类名，然后基于该类名定义多个值：

.home {
  @MYVAR: #9BC509;
}
.page {
  @MYVAR: #fff;
}

或者使用更少的防护装置（参见更少的文档）

相关内容

最新更新

热门标签：