将规则集传递给 Mixin

2025 年 3 月 17 日 | 阅读 1 分钟

您必须定义要将规则集传递到的 mixin 的结构。一个普通的独立规则集包含普通的规则集,如属性、嵌套规则集、变量声明、mixin 等。它存储在一个变量中,并包含到其他复制所有规则集的结构中。

让我们举个例子来演示如何在 Less 文件中将规则集传递给 mixin。

创建一个名为 "simple.html" 的 HTML 文件,其中包含以下数据。

HTML 文件:simple.html

现在创建一个名为 "simple.less" 的文件。 它类似于 CSS 文件。 唯一的区别是它以 ".less" 扩展名保存。

Less 文件:simple.less

将 "simple.html" 和 "simple.less" 两个文件放在 Node.js 的根文件夹中

现在,执行以下代码:lessc simple.less simple.css

passing rulesets to mixins1

这将编译 "simple.less" 文件。 将生成一个名为 "simple.css" 的 CSS 文件。

例如

passing rulesets to mixins2

生成的 CSS "simple.css" 具有以下代码

输出

passing rulesets to mixins3
下一个主题Less 函数