2015-05-28 44 views
3

分離的規則集(例如,LESS分離的規則集vs非參數混合

@detached-ruleset: { 
    @margin: 1px; 
    margin: @margin; 
}; 

和非參數混合?例如。

.mixin() { 
    @margin: 1px; 
    margin: @margin; 
} 

它們的行爲與嵌套操作符相同嗎?

最明顯的區別是語法(分號對規則集是強制性的),規則集保持它的變量是私有的,但這是我能找到的。該手冊沒有涉及太多的細節。

回答

5

分離的規則集是一個變量。對於變量中的最後一個聲明失敗並且變量被延遲加載。

對於可重複使用的代碼可以很容易地通過使用相同的名稱限定第二混入()擴展.mixin():

.mixin() { 
    @margin: 1px; 
    margin: @margin; 
} 

.mixin() { 
    color: red; 
} 

當使用分離的規則集在上述則應重複所有propperties導致第二個聲明將覆蓋第一:

@detached-ruleset: { 
    @margin: 1px; 
    margin: @margin; 
}; 

@detached-ruleset: { 
    @margin: 1px; 
    margin: @margin; 
    color: red; 
}; 

參見:https://stackoverflow.com/a/30384948/1596547