@variables不工作在css3

Question

我試圖在我的css文件中設置通用變量，我可以通過它調用，這樣我就可以保持事物的清潔和相同。

例子：

@shadow: 6px 6px 10px rgba(0,0,0,0.2); 

.shadow { 
    box-shadow: @shadow inset; 
} 

當我嘗試.shadow申請到一個元素，它不顯示我的網頁上的陰影。當我右鍵單擊並查看Chrome中的元素時，我會看到.shadow與「無效的屬性值」語句劃掉。

記住陰影只是一個例子，我有寬度，高度相同的問題，等等。

我已經看了，使用相同方法的jsfiddle網頁，但在這個chrome瀏覽器工作正常，所以我不相信它的瀏覽器的問題。

Answer 1

您只能用CSS預處理器（如LESS或SASS）聲明變量。 CSS3不提供變量聲明規則。

也許在您的JSFiddle頁面中包含這些預處理器，這樣您可能會感到困惑。