Less命名參數

mixin用自己的名字爲參數的值，而不是使用位置。 參數沒有任何順序用於放置值，可通過名稱引用。命名參數的結果更容易閱讀，並提供了清晰的代碼。

示例

下面的例子演示了 Less 文件中使用命名參數：

Example of Named Parameters

Hello World...

Welcome to Yiibai Yiibai ...

接下來，創建文件 style.less。

style.less

.mixin(@color: black; @fontSize: 10px) {
color: @color;
font-size: @fontSize;
}
.class1 {
.mixin(@fontSize: 20px; @color: #F5A9D0);
}
.class2 {
.mixin(#F79F81; @fontSize: 20px);
}

你可以編譯 style.less 使用下面的命令來生成 style.css 文件：

lessc style.less style.css

接着執行上面的命令，它會自動創建 style.css 文件，下面的代碼：

style.css

.class1 {
color: #F5A9D0;
font-size: 20px;
}
.class2 {
color: #F79F81;
font-size: 20px;
}

輸出結果

讓我們來執行以下步驟，看看上面的代碼工作：

• 保存上面的HTML代碼在 named_param.html 文件。

• 在瀏覽器中打開該HTML文件，得到如下輸出顯示。