CSS函數(shù)怎么寫？

CSS函數(shù)是CSS預處理器的一種功能，它允許你編寫可重用的代碼塊，這些代碼塊可以在整個樣式表中重復使用，CSS函數(shù)的基本語法如下：

@function functionName($arguments) {
  // 函數(shù)體
}

functionName是函數(shù)名，$arguments是參數(shù)列表，可以包含多個參數(shù)，用逗號分隔，函數(shù)體是具體的CSS代碼塊，可以包含任何有效的CSS屬性和值。

我們可以編寫一個名為calculate-color的函數(shù)，用于計算一種顏色：

@function calculate-color($red, $green, $blue) {
  @return rgba($red, $green, $blue, 1);
}

在這個函數(shù)中，我們使用了三個參數(shù)$red、$green和$blue，分別表示紅、綠、藍三種顏色的值，函數(shù)體中使用@return關鍵字返回了一個rgba顏色值，其中1表示不透明度。

在樣式表中，我們可以調(diào)用這個函數(shù)來生成顏色：

.my-element {
  background-color: calculate-color(255, 0, 0);
}

在這個例子中，我們調(diào)用了calculate-color函數(shù)，并傳入了三個參數(shù)值分別為255、0和0，表示紅色，我們將返回的顏色值設置為.my-element元素的背景顏色。

除了上述簡單的例子外，CSS函數(shù)還可以用于更復雜的場景，例如計算漸變色、生成隨機顏色等，通過編寫不同的函數(shù)，我們可以實現(xiàn)各種豐富的樣式效果。