CSS 函數定義變量 CSS 變量是一種用于存儲和使用值的機制。通過使用它們，您可以集中存儲值，從而輕松而快速地修改整個樣式表。CSS 變量可以通過 CSS 屬性（var）或 CSS 函數（var()）來引用。 CSS 函數定義變量（css-function-definition-variables）允許您定義具有自己參數的自定義函數。它們可以與其他函數一起使用，并產生根據使用情況而變化的值。創建自定義的函數可以幫助減少 CSS 文件的冗長和復雜度。 下面是一個使用 CSS 函數定義變量的示例：

:root {
--baseColor: #008080;
}
@function highlight($colorValue) {
@return mix($colorValue, white, 50%);
}
p {
color: highlight(var(--baseColor));
}

在這個示例中，我們定義了一個名為 “highlight” 的自定義函數，該函數接受一個顏色值。該函數使用 Sass 的 mix 函數將給定顏色值與白色進行混合。同時，我們在 :root 中定義了我們的基色變量，即 --baseColor。我們可以通過 var() 函數來引用這個變量，以及在我們的選擇器中調用我們的自定義函數。 總結 CSS 變量可以在整個樣式表中存儲和重復使用值。CSS 函數定義變量使您能夠創建自己的函數，并使用它們來生成特定的值。這可以使 CSS 文件更易于維護和修改，因為您只需要更新變量值或函數定義即可調整整個樣式表。