css - 为什么 less.js 不能计算颜色变量，而是在将 less 文件编译为 css 时计算出来的？

Question

我像这样在 less 文件中使用变量:

@base-color: #8156A3;
@base-color-darker: (@base-color - #111);

#searchForm{
   border: 1px solid @base-color-darker;
}

当我将 less 文件编译为 css 文件时，变量可以正常工作，但是当我将 less 文件用作页面样式表时，变量不会影响 in 元素。

这就是我链接 less.js 和 less 样式表的方式:

<script src="assets/js/less.min.js"></script>
<link rel="stylesheet" href="assets/less/main.less" />

哪里出了问题？

Answer 1

为了让 less.js 正确解析样式表，您需要在包含 less 文件时将 rel 属性设置为 stylesheet/less:

<link rel="stylesheet/less" href="assets/less/main.less" />

您还需要在 less.js 之前包含您的样式表。