Less之混合守衛

示例：

我們來看下面這個例子，定義了兩個混合：：

.common (@w; @h) when ( @w >= 100px) 
.common (@w; @h)

第乙個混合帶有條件判斷，第二個混合不帶有條件判斷，下面我們在兩個樣式類中引用上述的兩個混合：

.one

.two

編譯成 css **：

.one .two

可以看到，在.one中引用.common混合時，給@w引數賦值為150px，滿足@w >= 100px條件，所以**編譯後，.one樣式類輸出了兩個混合中的樣式屬性。.two樣式類則相反，不滿足@w >= 100px條件，最後只輸出了不帶條件判斷的混合中的樣式屬性。

guards比較運算子

less 中包含五個guards比較運算子，分別是>，>=，=，=<，<。關鍵字true是讓兩個mixins等價的唯一真值，所以以下兩個mixins是等價的：

.truth (@a) when (@a) 
.truth (@a) when (@a = true)

除了關鍵字true，其他任何值都是假值：

.truth (@a) when (@a) 
.one
.two

編譯成 css **：

.one

也可以對兩個變數進行比較，例如我們來看下面這個例子：

示例：在mixins中帶有兩個引數，如果引數@a的值大於@b，則width的值為@a，反之width的值為@b：

.xkd (@a; @b) when (@a > @b) 
.xkd (@a; @b) when (@a < @b) 
.one
.two

編譯成 css **：

.one .two

guards邏輯運算子

當mixins的判斷條件含有兩個或多個時，可以使用guards邏輯運算子將條件進行關聯。邏輯運算子有and、or、not三個。

示例：在mixins中我們給出了兩個條件，乙個是引數必須是顏色值，還有乙個是必須是紅色，只有同時滿足這兩個條件，才會輸出color屬性：

.xkd(@color) when (iscolor(@color)) and (@color = red) 
.one
.two

編譯成 css **：

.one

示例：

在mixins中有兩個條件，乙個是引數大於50px，乙個是引數小於200px，只要滿足其中乙個條件，就可以成功輸出：

.xkd(@width) when (@width > 50px), (@width < 200px) 
.one
.two

編譯成 css **：

.one .two

示例：

在mixins中給出了乙個條件，引數大於100px，但是因為使用了not關鍵字來否定這個條件，所有只要滿足小於100px就能成功輸出：

.xkd(@width) when not (@width > 100px) 
.one
.two

編譯成 css **：

.one

default()函式

default()函式可以用於根據已經建立好的的mixins條件來形成該條件的補集。

示例：

.xkd(@width) when (@width > 100px) 
.other(@width) when (default()) 
.one
.two

編譯成 css **：

.two

上述**中，在兩個樣式類中分別引用了.xkd和.other兩個混合，而.xkd中的條件為引數大於100px，.other中的條件為引數小於等於100px。default()就等價於@width <= 100px。