如何使這項工作SASS

-1

.rounded-corners { 
    -moz-border-radius-topleft: 4px;

和想要做的事，如：

$radius_size: 4; 

.rounded-corners { 
    -moz-border-radius-topleft: #{$radius_size}px;

或

.rounded-corners { 
    -moz-border-radius-topleft: $radius_sizepx;

但這些都不行。這個調用的語法是什麼？

thx

來源

2012-05-19 timpone

您使用的是哪個版本的sass？你的第一個例子（-moz-border-radius-topleft: #{$radius_size}px;）應該工作。它在3.1.16上適合我。

來源

2012-05-19 01:47:11 x1a4

'SASS（3.1.15，3.1.10，3.1.8，3.1.7） SASS護欄（3.1。 5，3.1.4，3.1.2，3.1.0）' – timpone

wierd似乎 - 現在工作;也許是一個無關的錯誤 – timpone

很酷。如果您需要知道您在應用中使用的寶石的確切版本，並且正在使用捆綁器，則可以執行「捆綁顯示」，例如， 'bundle show sass'，它會顯示你正在使用的確切的寶石。 – x1a4

你（使用插值）第一選擇看起來像它應該工作：

$radius_size: 4; 
.rounded-corners { 
    -moz-border-radius-topleft: #{$radius_size}px; 
}

一般，不過，我認爲這是最好的單位存儲在變量本身，因爲上海社會科學院將單位之間automatically convert（如果它可以）當您使用的變量在算術表達式：

$radius_size: 4px; 
.rounded-corners { 
    -moz-border-radius-topleft: $radius_size; 
}

來源

2012-05-19 02:06:12 hopper

-1

還要考慮使用Compass。有了它，你可以這樣寫：

$radius_size: 4px; 
.rounded-corners { 
    +border-top-left-radius($radius_size); 
}

而這個自動生成：

.rounded-corners { 
    -moz-border-radius-topleft: 4px; 
    -webkit-border-top-left-radius: 4px; 
    -o-border-top-left-radius: 4px; 
    -ms-border-top-left-radius: 4px; 
    -khtml-border-top-left-radius: 4px; 
    border-top-left-radius: 4px; 
}

來源

2012-05-19 03:15:08 gdelfino

如何使這項工作SASS

回答

相關問題