Less混合作用域

mixin的組成變量和混合類型可以在調用者的範圍內使用及其是可見的。但有一個例外，如果調用方包含具有相同名稱的變量，那麼這個變量不會複製到調用者的範圍。只有調用者的作用域內的變量是受保護的，而繼承的變量將被覆蓋。

示例

下面的例子演示了LESS文件中使用 mixin 作用域：

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

style.less

.mixin() {
@bgcolor: #C0C0C0;
}
.myclass{
.mixin();
background-color: @bgcolor;
}

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

lessc style.less style.css

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

style.css

.myclass {
background-color: #C0C0C0;
}

輸出結果

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

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

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