在LESS中使用邊框寬度參數

Question

我仍然在發現此技術的實用性。 如果有人能回答我，我有問題。我試圖創建一個功能，如：

.advancedBorder(@color, @size) 
{ 
    border: @size solid @color; 
} 

div 
{ 
    .advancedBorder(#FFF, 1px 0px 1px 0px); 
} 

所以，我嘗試了很多方式使它成爲可能，但沒有任何成功。

真正的原因是創建一個功能，可以添加到任何框，併爲它設置任何邊框尺寸和顏色，我更喜歡用最少的代碼行。 有人可以告訴我怎麼做？

謝謝！

Answer 1

生成的語法在CSS中無效。您傳遞的情況如下：

@color = #FFF @size = 1px 0px 1px 0px

這在你的mixin將產生：

border: 1px 0px 1px 0px solid #FFF;

爲CSS。這不是CSS中邊框的有效縮寫。你需要這樣的東西：

.advancedBorder(@color, @size){ 
    border-width: @size; 
    border-color: @color; 
    border-style: solid; 
}