以前在网页切图的时候，会觉得css如果能有变量 逻辑这些 会很方便，它来了，less.js插件可以使得css有类似变量的语法，它不是很新的技术，习惯用它的人会觉得很好用，而且它可以直接像jquery一样直接在网页上引用，也可以体验，不过仅仅适合体验，这种直接引用的方式不适合正式情况下用，因为页面js会有一个执行的时间，所以看起来会不流畅，可以在环境下开发，然后编译出来。
在HTML中，可以使用Less作为CSS预处理器来提高代码的可维护性和可复用性。以下是在HTML中使用Less的步骤：
1. 引入Less文件
在HTML文件中，使用<link>标签引入Less文件，如下所示：
<link rel="stylesheet/less" type="text/css" href="styles.less">
2. 引入Less.js
在页面的底部引入Less.js文件，如下所示：
<script src="less.min.js"></script>
3. 编写Less代码
在styles.less中编写Less代码，例如：
@font-size: 16px;
h1 {
font-size: @font-size;
color: red;
}
注意，在Less中使用变量需要使用@符号来声明。
4. 编译Less代码
当网页加载时，Less.js会将styles.less文件编译为CSS，并将其替换为<link>标签的href属性中的CSS文件。
通过在本地安装Less和使用命令行工具来编译Less文件，可以避免在生产环境中依赖Less.js。
文章来源 如何在html中使用less，亲测可用 | 切图网
